728x90 Frontend/Javascript22 [JavaScript] 프로미스(Promise) 자바스크립트에서 프로미스(Promise)란, 비동기식으로 처리되는 코드의 결과를 담게 되는 객체입니다. 실행되는 코드의 결과 값에 따라서 어떠한 동작을 실행할지 정할 수 있기 때문에 코드 로직을 더 섬세하게 작성하는 것이 가능해집니다. 보통 네트워크 통신이나 파일을 읽을 때 사용되는데, 데이터를 읽지 못한 상황에서도 데이터를 표시하려고 하면 발생하는 오류를 프로미스를 통해 예방할 수 있기 때문입니다. 프로미스는 세 가지 상태를 가질 수 있습니다. 1) 대기(Pending) : 프로미스가 선언되면 가지게 되는 초기 값으로, 비동기 처리 연산이 완료되기까지 대기하고 있는 상태입니다. 2) 이행(Fulfilled) : 비동기 처리 연산이 성공적으로 완료된 상태입니다. 3) 거절(Rejected) : 비동기 처.. 2023. 8. 8. [JavaScript] 템플릿 리터럴(Template Literal) 템플릿 리터럴(Template Literal)은 내장된 표현식을 허용하는 문자열 리터럴입니다. ES6부터 새로 도입되었으며, 따옴표가 아닌 백틱(`)을 사용합니다. 이번 글에서는 템플릿 리터럴의 특징과 기능에 대해서 설명하겠습니다. ① 여러 줄 문자열 일반 문자열과 직관적으로 다르게 느껴지는 특징 중 하나는 여러 줄인 문자열을 작성할 때의 편리함입니다. 일반적인 문자열에서 여러 줄인 문자열을 작성한다면, 백슬래쉬를 통해 줄 바꿈을 뜻하는 \n을 사용해야 합니다. console.log("Line number 1\n" + "Line number 2"); // Without template literal 하지만 템플릿 리터럴을 사용한다면, 작성된 코드에서의 줄바꿈이 그대로 결과로 표시됩니다. 앞서 나온 코드는.. 2023. 8. 7. [JavaScript] toUpperCase(), toLowerCase() 메서드 JavaScript에는 문자열(string)을 모두 대문자로 변경하거나, 모두 소문자로 변경할 수 있는 메서드가 있습니다. - toUpperCase() : 문자열을 대문자로 변환하는 메서드 - toLowerCase() : 문자열을 소문자로 변환하는 메서드 let ex_str = "Hello World!" console.log(ex_str.toUpperCase()); // HELLO WORLD! console.log(ex_str.toLowerCase()); // hello world! 단 JavaScript에서 문자열은 불변하기 때문에, 두 메서드를 사용해도 원본 문자열에는 영향이 가지 않습니다. 2023. 6. 27. [JavaScript] \을 사용한 이스케이프 시퀀스 JavaScript에서도 역슬래시(\) 문자를 통해서 특수문자나 입력 불가능한 문자들을 표현합니다. 이러한 표현 방법을 이스케이프 시퀀스(Escape Sequence)라고 합니다. 다음은 유형별로 정리한 이스케이프 시퀀스의 예시들입니다. 1) 화이트 스페이스코드\n\t\v\f출력개행(줄바꿈)수평 탭수직 탭폼 피드(페이지 나누기) 2) 특수문자특수문자들은 단순히 역슬래시를 앞에 붙이게 되면 해당 특수문자를 표현하게 됩니다. [예시] \^, \$, \\, \', \", \|, \/※ JavaScript에서는 작은따옴표 문자열과 큰따옴표 문자열을 구분하지 않습니다. 따라서 모든 이스케이프 문자는 작은따옴표나 큰따옴표 상관없이 작동합니다. 3) 유니코드 문자이스케이프 시퀀스를 통해서 16.. 2023. 6. 26. [JavaScript] 불변성(Immutability)을 유지하는 방법 객체 타입(Object Type)의 데이터는 변경될 수 있어서 예상치 못한 오류가 발생할 수 있습니다. 다음과 같은 코드를 보면, y의 속성 값을 변경했는데 x의 속성 값도 같이 변경되는 것을 확인할 수 있습니다. let x = { size: 21 }; let y = x; y.size = 25; console.log(x.size); // 25 만약 코드가 더욱 복잡해진다면, 코드의 결과를 예측하기가 어려워집니다. 이러한 문제점을 해결하기 위해서 크게 2가지의 방법이 존재합니다. 객체 타입의 데이터를 복사할 때 깊은 복사를 하는 방법과, 객체 자체를 불변하게 만드는 것입니다. ① 깊은 복사하기 얕은 복사는 해당 객체만 복사하여 새로운 객체가 같은 메모리 주소를 참조하고 있게 합니다. 반대로 깊은 복사는 해.. 2023. 6. 25. [JavaScript] 불변성(Immutability) vs 가변성(Mutability) 불변성(Immutability)과 가변성(Mutability)는 다른 언어에서도 사용되는 개념이지만, 이번 글에서는 자바스크립트에서 불변성과 가변성의 개념에 대해서 설명하겠습니다. 변경이 불가능한 데이터 타입은 원시 타입(Primitive Type)이라고 합니다. 원시 타입의 유형으로는 불리언, 문자열, 수, null, undefined, Symbol이 있습니다.. 원시 타입의 데이터를 변수에 할당한다는 것은, 값이 저장되어 있는 메모리의 주소를 변수가 직접적으로 가리키게 하는 것입니다. 원시 타입이 불변하다는 것은, 원시 타입의 데이터가 저장되어 있는 메모리 영역에서의 변경이 불가하다는 뜻입니다. 따라서 만약 원시 타입이 저장되어 있는 변수의 값을 변경하고자 한다면, 기존의 값이 저장되어 있는 메모리 .. 2023. 6. 24. 이전 1 2 3 4 다음 반응형
