본문 바로가기

Language/Javascript24

화살표 함수 기본 화살표 함수라는 이름은 문법의 생김새를 차용해 지어졌습니다. 예시 let sum = (a, b) => a + b; /* 위 화살표 함수는 아래 함수의 축약 버전입니다. let sum = function(a, b) { return a + b; }; */ alert( sum(1, 2) ); // 3 보시는 바와 같이 (a, b) => a + b는 인수 a와 b를 받는 함수입니다. (a, b) => a + b는 실행되는 순간 표현식 a + b를 평가하고 그 결과를 반환합니다. 인수가 하나밖에 없다면 인수를 감싸는 괄호를 생략할 수 있습니다. 괄호를 생략하면 코드 길이를 더 줄일 수 있습니다. 예시 let double = n => n * 2; // let double = function(n) { return n.. 2022. 12. 16.
nullish 병합 연산자 '??' nullish 병합 연산자(nullish coalescing operator) ??를 사용하면 짧은 문법으로 여러 피연산자 중 그 값이 ‘확정되어있는’ 변수를 찾을 수 있습니다. a ?? b의 평가 결과는 다음과 같습니다. a가 null도 아니고 undefined도 아니면 a 그 외의 경우는 b nullish 병합 연산자 ??없이 x = a ?? b와 동일한 동작을 하는 코드를 작성하면 다음과 같습니다. x = (a !== null && a !== undefined) ? a : b; 비교 연산자와 논리 연산자만으로 nullish 병합 연산자와 같은 기능을 하는 코드를 작성하니 코드 길이가 길어지네요. 또 다른 예시를 살펴봅시다. firstName, lastName, nickName이란 변수에 사용자 이름.. 2022. 12. 16.
자료형 요약 자바스크립트에는 여덟 가지 기본 자료형이 있습니다. 숫자형 – 정수, 부동 소수점 숫자 등의 숫자를 나타낼 때 사용합니다. 정수의 한계는 ±253 입니다. bigint – 길이 제약 없이 정수를 나타낼 수 있습니다. 문자형 – 빈 문자열이나 글자들로 이뤄진 문자열을 나타낼 때 사용합니다. 단일 문자를 나타내는 별도의 자료형은 없습니다. 불린형 – true, false를 나타낼 때 사용합니다. null – null 값만을 위한 독립 자료형입니다. null은 알 수 없는 값을 나타냅니다. undefined – undefined 값만을 위한 독립 자료형입니다. undefined는 할당되지 않은 값을 나타냅니다. 객체형 – 복잡한 데이터 구조를 표현할 때 사용합니다. 심볼형 – 객체의 고유 식별자를 만들 때 사.. 2022. 12. 16.
엄격 모드 엄격모드의 기원 자바스크립트는 꽤 오랫동안 호환성 이슈 없이 발전해왔습니다. 기존의 기능을 변경하지 않으면서 새로운 기능이 추가되었죠. 덕분에 기존에 작성한 코드는 절대 망가지지 않는다는 장점이 있었습니다. 하지만 자바스크립트 창시자들이 했던 실수나 불완전한 결정이 언어 안에 영원히 박제된다는 단점도 생겼습니다. 이런 상황은 ECMAScript5(ES5)가 등장하기 전인 2009년까지 지속되었습니다. 그런데 새롭게 제정된 ES5에서는 새로운 기능이 추가되고 기존 기능 중 일부가 변경되었습니다. 기존 기능을 변경하였기 때문에 하위 호환성 문제가 생길 수 있겠죠? 그래서 변경사항 대부분은 ES5의 기본 모드에선 활성화되지 않도록 설계되었습니다. 대신 use strict라는 특별한 지시자를 사용해 엄격 모드(.. 2022. 12. 16.
Object.values Object.values 메서드란? Object.values() 는 파라미터로 전달된 객체가 가지는 열거 가능한 속성의 값들로 구성된 배열을 반환합니다. 배열의 값들이 순서는 오브젝트의 속성을 for in 구문등으로 반복한 결과와 동일합니다. (참고로 for in 구문은 순서를 보장하지 않습니다) Object.values(obj); 예시 var obj = { foo: 'bar', baz: 42 }; console.log(Object.values(obj)); // ['bar', 42] // 유사 배열 (숫자를 속성으로 사용하는 객체) var obj = { 0: 'a', 1: 'b', 2: 'c' }; console.log(Object.values(obj)); // ['a', 'b', 'c'] // 유사 배.. 2022. 12. 16.
Reduce reduce 메서드의 형태 arr.reduce(callback(accmulator, currentValue, index, array), initialValue) arr - 순회하고자 하는 배열 accumulator - 누적되는 값 - callback 함수의 반환값을 누적 - initialValue를 설정한 경우 callback의 최초 호출시 initialValue로 값으로 초기화 currentValue - 현재 배열의 요소 index(생략 가능) - 현재 배열 요소의 index - initialValue가 없을 경우 arr의 0번째 인덱스 값으로 초기화 array(생략 가능) - reduce 함수를 호출한 배열 initialValue(생략 가능) - callback의 최초 호출시 accumulator 초.. 2022. 12. 16.