자바스크립트 프로퍼티 접근 방법의 차이

공부도중 문득 궁금한게 생겼다

Object.gogo = '1';
Object[gogo] = '1';

단순히 선택의 문제인줄 알았는데, 두 방식의 차이점이 존재한다.

- . 방식: 컴파일시 접근

- [] 방식: 런타임시 접근

(참고: 컴파일 -> 런타임)

이라고는 하지만

실제로 제일 와닿는 부분은

변수로 접근하냐, 적힌 문자열 그대로 접근하냐의 차이다.

아래를 보면 이해가 잘 간다.

let person = { };

function setProperty(name, value) {
    /** []: 변수로 접근 가능 */
    person[name] = value;

    /** .: 바로 접근 (매개변수로 name이 아니라 문자열 그대로 'name' 프로퍼티에 바로 접근) */
    person.name = value;
}

setProperty('custom_name', 10000);
console.log(person);