JavaScript에서 동적 값과 개체를 만드는 방법은 무엇입니까?-JS 튜토리얼-php.cn

구문

Algorithm

예제 2

집

웹 프론트엔드

JS 튜토리얼

JavaScript에서 동적 값과 개체를 만드는 방법은 무엇입니까?

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB

Sep 20, 2023 am 10:57 AM

如何在 JavaScript 中创建动态值和对象？

동적 값은 동적 변수에 할당하는 값입니다. 동적 변수는 특정 이름 없이 코드에 하드 코딩된 변수로, 코드가 실행되는 동안 해당 주소가 결정됩니다. "동적"이라는 이름은 조작되고 변경될 수 있는 값을 나타냅니다.

여기에서는 JavaScript에서 동적 값(객체 값의 일부이기도 함)을 생성하고 나중에 그룹에 액세스하지 않고 동적 변수 이름을 변경하는 방법을 살펴보겠습니다. 이는 변수를 선언한 다음 객체의 키 중 하나와 동일한 변수를 사용하고 나중에 변수 이름을 변경해야 하는 경우 객체에 액세스하지 않고도 변경할 수 있음을 의미합니다.

위 작업을 수행하려면 아래와 같이 대괄호 [ ]를 사용하여 개체에 변수 이름을 할당하기만 하면 됩니다. -

구문

다음은 동적 값과 개체를 생성하는 구문입니다.

const key = &#39;KeyName&#39;;
const obj = { [key] : &#39;value&#39;};

로그인 후 복사

여기서 key 및 value는 객체를 생성하는 데 사용되는 키-값 쌍이고, "obj" 및 keyName >은 키 값입니다.

Algorithm

1단계 - 객체를 생성하는 데 사용되는 키를 정의합니다.
2단계 - 객체를 생성하고 위에 정의된 키를 사용합니다.
3단계 - 위에서 생성한 객체에 JSON.stringify()를 적용하여 객체를 표시합니다.

예제 1

다음 HTML 프로그램을 사용하여 동적 변수 선언을 볼 수 있습니다.

<!DOCTYPE html>
<html>
<body>
   <h2> JavaScript Dynamic values </h2>
   <div id = "result"> </div>
   <script>
      const key1 = "Haircolour";
      const key2 = "Eyecolour";
      const person = {
         f_name : "Rohan",
         l_name :"Joshi",
         [key1] : "Black",
         [key2] : "Brown"
      };

      // Converting the object value to show its value in html
      str = JSON.stringify(person);
      document.getElementById("result").innerHTML = str;

      // To print value of object in console
      console.log(person);
   </script>
</body>
</html>

로그인 후 복사

그래서 위 코드에서 우리는 중괄호 []를 사용하지 않고 객체에 두 개의 키 f_name과 l_name을 선언했으며 key1과 key2 변수에 중괄호를 사용하고 있음을 알 수 있습니다. 왜냐하면 이 두 키는 각각 동적 값이기 때문입니다. .

출력에서 key1 변수의 이름은 Eyecolour이고 key2 변수의 값은 Haircolour임을 알 수 있습니다.

예제 2

여기에 객체에 액세스하지 않고 동적 변수의 이름을 변경하는 방법을 더 밝혀 주는 또 다른 코드가 있습니다. 여기서는 코드에서 두 동적 변수의 이름을 바꾸었습니다.

<!DOCTYPE html>
<html>
<body>
   <h2> JavaScript Dynamic values </h2>
   <div id = "result"> </div>
   <script>
      const key1 = "Haircolour";
      const key2 = "Eyecolour";
      const person = {
         f_name : "Rohan",
         l_name :"Joshi",
         [key1] : "Black",
         [key2] : "Brown"
      };

      // Converting the object value to show its value in html
      str = JSON.stringify(person);
      document.getElementById("result").innerHTML = str;

      // To print value of object in console
      console.log(person);
   </script>
</body>
</html>

로그인 후 복사

출력에서 두 변수 key1과 key2의 값은 동일하게 유지되지만 객체에 액세스하지 않고도 이름이 변경되는 것을 볼 수 있으므로 이것이 JavaScript와 객체에서 동적 값을 생성하는 방법입니다.

위 내용은 JavaScript에서 동적 값과 개체를 만드는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

본 웹사이트의 성명

본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.

핫 AI 도구

뜨거운 도구

뜨거운 주제

Gmail 이메일의 로그인 입구는 어디에 있나요?

7543

Cakephp 튜토리얼

1381

Steam의 계정 이름 형식은 무엇입니까?

Win11 활성화 키 영구

NYT 연결 힌트와 답변

Related knowledge

내 자신의 JavaScript 라이브러리를 어떻게 작성하고 게시합니까? Mar 18, 2025 pm 03:12 PM

기사는 JavaScript 라이브러리 작성, 게시 및 유지 관리, 계획, 개발, 테스트, 문서 및 홍보 전략에 중점을 둡니다.

브라우저에서 성능을 위해 JavaScript 코드를 최적화하려면 어떻게해야합니까? Mar 18, 2025 pm 03:14 PM

이 기사는 브라우저에서 JavaScript 성능을 최적화하기위한 전략에 대해 설명하고 실행 시간을 줄이고 페이지로드 속도에 미치는 영향을 최소화하는 데 중점을 둡니다.

프론트 엔드 열 용지 영수증에 대한 차량 코드 인쇄를 만나면 어떻게해야합니까? Apr 04, 2025 pm 02:42 PM

프론트 엔드 개발시 프론트 엔드 열지대 티켓 인쇄를위한 자주 묻는 질문과 솔루션, 티켓 인쇄는 일반적인 요구 사항입니다. 그러나 많은 개발자들이 구현하고 있습니다 ...

브라우저 개발자 도구를 사용하여 JavaScript 코드를 효과적으로 디버그하려면 어떻게해야합니까? Mar 18, 2025 pm 03:16 PM

이 기사는 브라우저 개발자 도구를 사용하여 효과적인 JavaScript 디버깅, 중단 점 설정, 콘솔 사용 및 성능 분석에 중점을 둡니다.

누가 더 많은 파이썬이나 자바 스크립트를 지불합니까? Apr 04, 2025 am 12:09 AM

기술 및 산업 요구에 따라 Python 및 JavaScript 개발자에 대한 절대 급여는 없습니다. 1. 파이썬은 데이터 과학 및 기계 학습에서 더 많은 비용을 지불 할 수 있습니다. 2. JavaScript는 프론트 엔드 및 풀 스택 개발에 큰 수요가 있으며 급여도 상당합니다. 3. 영향 요인에는 경험, 지리적 위치, 회사 규모 및 특정 기술이 포함됩니다.