JavaScript에서 객체에 값을 추가하는 방법

Javascripteseo Gaegchee Gabs Eul Chugahaneun Bangbeob



개체는 불변 속성으로 인해 프로그래밍 언어에서 가장 중요한 개체입니다. 이 속성을 사용하여 개발자는 개체를 통해 다양한 작업을 조작할 수 있습니다. 기존 개체에 다른 값을 추가하여 개체를 런타임에 변경합니다. JavaScript는 JavaScript의 객체에 값을 추가하는 다양한 내장 메서드를 제공합니다. 이 게시물에서는 JavaScript의 개체에 값을 추가하는 예제와 함께 가능한 모든 방법을 보여줍니다. 이 게시물은 다음과 같은 학습 결과를 제공합니다.

방법 1: JavaScript에서 Object.assign() 메서드를 사용하여 개체에 값 추가

그만큼 Object.assign() 메소드는 객체에 값을 추가하는 것으로 유명합니다. 두 가지 인수가 필요합니다. 첫 번째는 대상 개체를 나타내고 두 번째 인수는 키/값 쌍을 사용합니다. 구문 Object.assign() 방법은 다음과 같습니다.

통사론







물체 . 양수인 ( 대상, 출처 ) ;

매개변수는 다음과 같이 설명됩니다.



  • 표적 : 값이 추가될 객체를 지정합니다.
  • 원천 : 추가되는 값을 나타냅니다.

다음 예제 코드를 통해 이 방법의 작동을 이해해 보겠습니다.



암호





콘솔. 통나무 ( 'assign() 메서드를 사용하는 예' ) ;

user_obj 하자 = {

1 : { 이름 : '아담' } ,

: { 이름 : '괴롭히다' } ,

} ;

obj 하자 = 물체 . 양수인 ( user_obj, { : { 이름 : '자삼' } } ) ;

콘솔. 통나무 ( 오브제 ) ;

이 코드에서:

  • 첫째, '아담' 그리고 '괴롭히다' 에 값으로 할당됩니다. '이름' 재산.
  • 그만큼 Object.assign() 방법을 사용하여 추가 '자삼' 가치 'user_obj' 물체.
  • 마지막으로, console.log() 방법은 콘솔 창에 모든 값을 표시하는 데 사용됩니다.



산출

출력에서 새 값이 개체에 성공적으로 추가되었음을 알 수 있습니다.

방법 2: push() 메서드를 사용하여 JavaScript의 배열 객체에 값 추가

그만큼 푸시() 메소드를 사용하여 하나 이상의 값을 배열에 추가하거나 삽입할 수 있습니다. 이 메서드는 값을 추가한 후 새 배열을 반환합니다. 다음 구문을 통해 작동하는지 봅시다.

통사론

아. 푸시 ( 값1, 값2, ..., 값N )

이 구문에서 '값1', '값2' 그리고 '값N' '에 추가할 값입니다. '변수.

암호

콘솔. 통나무 ( 'assign() 메서드를 사용하는 예' ) ;

상수 스포츠 = [ '크리켓' , '하키' , '축구' ] ;

상수 카운터 = 스포츠. 푸시 ( '농구' ) ;

콘솔. 통나무 ( 카운터 ) ;

콘솔. 통나무 ( 스포츠 ) ;

코드에 대한 설명은 다음과 같습니다.

  • 이름이 지정된 배열 '스포츠' 세 가지 요소, 즉, '크리켓', '하키' 그리고 '축구' .
  • 그 후, 값 '농구' 를 사용하여 추가됩니다. sports.push() 자바스크립트의 메소드.
  • 결국, console.log() 메소드는 콘솔 창에 배열을 표시합니다. .

산출

출력은 다음을 보여줍니다. '농구' 값이 추가됩니다. 스포츠 객체를 활용하여 푸시() 방법.

방법 3: Spread(…) 연산자를 사용하여 JavaScript의 개체에 값 추가

스프레드(…) 연산자는 JavaScript에서 개체에 값을 추가하는 데 사용됩니다. 개체를 한 곳으로 병합하는 것이 유용합니다. 스프레드 연산자의 구문은 다음과 같습니다.

통사론

{ ... 오브제 , 열쇠 : '값' }

이 구문에서 '값' 에 할당된다 열쇠 개체에서 오브제 .

개체에 값을 추가하는 스프레드 연산자의 예제 코드는 다음과 같습니다.

암호

콘솔. 통나무 ( '확산 연산자를 사용하는 예' ) ;

obj1하자 = { 이름 : '괴롭히다' } ;

obj2 = { ... obj1 , 색깔 : '하얀' } ;

콘솔. 통나무 ( obj2 ) ;

이 코드에서:

  • 'OBJ1 '는 요소를 저장하는 데 사용됩니다. 이름 값을 할당하여 '괴롭히다' .
  • 그 후, '하얀' 값 추가 'OBJ1' .
  • 결국, console.log() 메소드는 콘솔 창에 추가된 값을 표시합니다.

산출

출력은 새 객체 '를 보여줍니다. obj2 ' 객체의 값을 포함하는 ' obj1 ' 뿐만 아니라 추가된 값 ' 하얀 '.

결론

JavaScript는 두 가지 방법을 제공합니다. Object.assign() 그리고 푸시() 개체에 값을 추가합니다.

그만큼 Object.assign() 키/값 쌍으로 개체에 값을 추가하는 메서드입니다. 그만큼 푸시() 메소드는 하나 이상의 값을 배열에 추가합니다. 그러나, 그 확산 (…) 연산자를 사용하여 개체에 값을 추가할 수도 있습니다. 이 게시물은 JavaScript에서 객체에 값을 추가하는 모든 가능성을 보여주었습니다.