strict mode

ES5에서 새로운 기능이 추가되고 기존 기능 중 일부가 변경 > 하위 호환성 문제가 생김 > 변경사항 대부분은 ES5 기본모드에서 활성화되지 않도록 설계

use strict 지시자를 통해 엄격모드(strict mode)를 활성화 했을 때만 변경사항이 활성화

• 'use strict'는 스크립트 최상단에 위치시킨다
• strict mode가 적용되면 돌이킬 수 없다
• 클래스와 모듈 사용 시 use strict 명시할 필요가 없다
• 테스트 목적으로 브라우저 콘솔 사용 시, 기본적으로 use strct가 적용되어 있지않다 👉'use strict' 입력 후 Shift + Enter를 눌러 스크립트 입력

polyfill

명세서에 등록된 지 얼마 안 된 기능은 특정 엔진에서 지원하지 않음 👉 Babel 사용

Babel

• JavaScript 구 표준을 준수하는 코드로 변경해주는 Transpiler
• Webpack 같은 모던 프로젝트 빌드 시스템은 자동으로 트랜스파일러를 동작시킨다

polyfill

• 구현이 누락된 새로운 기능을 메꿔주는 역할
• 새로 업데이트 된 함수를 직접 구현해서 사용할 때
• 기존 함수를 수정할 때

core js, polyfill.io

computed property

let fruit = prompt("과일 이름을 입력하세요");

let bag = {
	[fruit]: 5; // 프로퍼티 이름을 동적으로 받아 옴
};

alert(bag.apple); // fruit에 apple이 할당되었다면, 5가 출력

[fruit]는 프로퍼티 이름을 변수 fruit에서 가져오겠다는 것을 의미한다

위와 아래는 같은 코드

let bag = {};
bag[fruit] = 5;

대괄호 안에는 복잡한 표현식이 올 수도 있다

let fruit = 'apple';
let bag = {
	[fruit + 'Computers']: 5 // bag.appleComputer = 5
};

• 대괄호 표기법은 프로퍼티 이름과 값의 제약을 없애주기 때문에 점 표기법보다 훨씬 강력하다
• 처음엔 점 표기법을 사용하다가 복잡한 상황이 발생했을 때 대괄호 표기법으로 바꾸는 경우가 많다

in 연산자

'in' 연산자로 객체 내 프로퍼티 존재 여부 확인하기

자바스크립트는 존재하지 않는 프로퍼티에 접근 시에 에러가 발생하지 않고 undefined를 반환한다
👉 이 특징을 응용해서 프로퍼티 존재 여부를 확인 가능

let user = { name: 'Jinju', age: 26};

alert('age' in user); // true
alert('blahblah' in user); // false

프로퍼티는 따옴표로 감싼 문자열

객체 요약

• 객체는 특수한 기능을 가진 연관 배열(associative array)
• 프로퍼티 key는 문자열이나 심볼이어야 한다. 보통은 문자열이다
• 값은 어떤 자료형도 가능하다
• 프로퍼티 접근법
  * 점 표기법: obj.property
  • 대괄호 표기법: obj["property"]
• 추가 연산자 사용 가능
  * 프로퍼티 삭제하고 싶을 때 delete obj.prop
  • 해당 key를 가진 프로퍼티가 객체 내에 있는지 확인하고자 할 때 "key" in obj
  • 프로퍼티를 나열할 때 for (let key in obj)
• 이외에도 다양한 종류의 객체
  * Array - 정렬된 데이터 컬렉션을 저장할 때
  • Date - 날짜와 시간 정보를 저장할 때
  • Error - 에러 정보를 저장할 때