[Javascript]object.key, object['key'] 및 object[key]의 차이

object[key]는 변수로 접근하지만, object.key 및 object['key']는 object(객체)의 property(key)에 접근한다. 

 

example 1

let num = {
  one: 1,
  two: 2,
};

let one = "two";

console.log(num.one); // result: 1 --> num object에서 one이라는 key의 value 값을 출력한다. 
console.log(num["one"]); // result: 1 --> num object에서 one이라는 key의 value 값을 출력한다. 
console.log(num[one]); // result: 2 --> one이라는 변수에는 num object의 two라는 key 값이 할당되었기 때문에(??뭔지 좀 이해가 안간다..) num object에서 two라는 key의 value 값을 출력한다.

example 2

const user = { name: "Steve", age: 4 };

function printValue(obj, key) {
  // console.log(obj.key); undefined --> user라는 object에는 'key'라는 key값이 없기 때문에 발생
  // console.log(obj["key"]); undefined --> 위와 동일
  console.log(obj[key]); // ['key']가 아니라 [key]를 사용 했다. 변수로 접근. 즉, 아래 printValue의 "name"과 "age"에 해당하는 key의 value 값을 출력한다.
}

printValue(user, "name"); // result: Steve
printValue(user, "age"); // result: 4