키에 대한 참조로 개체 값 가져오기

1. JavaScript에서 객체의 액세스 속성
2. JavaScript에서 대괄호를 사용하여 참조 변수로 객체의 값 가져오기

JavaScript에서 개체는 키-값 쌍으로 작성됩니다. 키로 객체의 값을 얻을 수 있습니다.

그러나 변수로 키를 참조하고 변수를 사용하여 개체의 값에 액세스하는 것도 가능합니다. 이 기사에서는 이를 달성하는 방법을 소개합니다.

JavaScript에서 객체의 액세스 속성

JavaScript에는 객체의 속성에 액세스하는 다양한 방법이 있습니다. 속성으로 개체의 키를 의미합니다.

대괄호 [], 점 연산자 . 및 객체 구조 분해를 사용하여 속성 값을 얻을 수 있습니다. 그들 각각을 살펴 보겠습니다.

아래 예와 같이 값을 가져오려면 대괄호 안에 있는 속성을 참조해야 합니다.

예제 코드:

var age = {Jack: 25, Danny: 23, Harry: 24}

          console.log(age['Jack']);

출력:

25

위의 예에서 문자열의 속성과 숫자의 값을 포함하는 age 개체가 있습니다. 대괄호를 사용하여 Jack 속성을 호출하여 25 값에 액세스했습니다.

점 연산자를 사용하여 이 작업을 수행해 봅시다.

console.log(age.Danny);  // 23

도트 연산자를 사용하여 개체에서 속성을 호출하여 값에 액세스할 수 있습니다. 대괄호 표기법을 사용하면서 차이점을 확인하십시오.

우리는 인용문 안에 재산을 썼습니다. 속성이 문자열이기 때문입니다.

그러나 속성이 문자열에 있더라도 점 연산자를 사용하는 동안 따옴표를 사용할 필요가 없습니다.

이제 객체를 분해하여 값에 액세스해 보겠습니다.

var {Harry} = age
console.log(Harry)  // 24

여기에서 Harry 속성을 중괄호 {} 안에 배치했습니다. 변수처럼 작동하며 age 객체를 값으로 보유합니다.

Harry 속성 값에 액세스할 수 있습니다. 이를 객체 분해라고 합니다.

JavaScript에서 대괄호를 사용하여 참조 변수로 객체의 값 가져오기

또한 객체의 속성을 변수로 참조하고 이를 사용하여 객체의 값에 액세스할 수 있습니다. 대괄호 표기법 []을 사용하여 수행할 수 있습니다.

예를 들어 위에서 생성한 age 개체를 고려하십시오. 다음으로 name 변수를 생성하고 Jack으로 설정합니다.

그런 다음 아래와 같이 대괄호 표기법을 사용하여 name 변수에 액세스하여 객체의 값을 가져옵니다.

예제 코드:

var age = {Jack: 25, Danny: 23, Harry: 24}

var name = 'Jack';
console.log(age[name]);

출력:

25

도트 연산자를 사용하는 동안에는 불가능합니다.

console.log(age.name);  // undefined

이런 식으로 대괄호를 사용하여 JavaScript에서 속성이 참조하는 변수를 통해 객체의 값에 액세스할 수 있습니다.