HOWTO · JavaScript
JavaScript의 개체에서 속성 제거
이 튜토리얼에서는 JavaScript의 객체에서 속성을 제거하는 방법을 설명합니다.
이 페이지의 내용
이 튜토리얼은 여러 메서드를 사용하여 JavaScript의 객체에서 속성을 제거하는 방법을 설명합니다. ECMAScript 6에서delete 연산자,reassignment 메커니즘,underscore 라이브러리 및spread 구문을 사용하여 시연합니다.
delete 연산자를 사용하여 JavaScript의 객체에서 속성 제거
객체의 속성을 제거하는 한 가지 방법은 delete연산자입니다. 이 연산자는 객체에서 속성을 제거합니다. 예를 들어,id,subject 및grade 속성을 가진myObject 객체가 있고grade 속성을 제거해야합니다.
var myObject = {'id': '12345', 'subject': 'programming', 'grade': 'A'};
console.log('Original object:', myObject);
// delete the grade property
delete myObject.grade
console.log('Updated object: ', myObject)
출력:
Original object: {id: "12345", subject: "programming", grade: "A"}
Updated object: {id: "12345", subject: "programming"}
underscore 라이브러리를 사용하여 JavaScript의 객체에서 속성 제거
JavaScript의 객체에서 속성을 제거하는 데 도움이되지만 원래 객체를 업데이트하지 않는 라이브러리 중 하나는 underscore 라이브러리입니다. 이 라이브러리는 두 가지 중요한 함수_.pick()과_.omit()을 제공합니다.
_.omit()함수는 객체에서 주어진 속성을 제거하고 업데이트 된 사본을 반환 할 수 있습니다.
var myObject = {'id': '12345', 'subject': 'programming', 'grade': 'A'};
console.log('Original object:', myObject);
var updatedObject = _.omit(myObject, 'grade')
console.log('Updated object with omit() : ', updatedObject)
console.log('Original object after update:', myObject);
출력:
Original object: {id: "12345", subject: "programming", grade: "A"}
Updated object with omit() : {id: "12345", subject: "programming"}
Original object after update: {id: "12345", subject: "programming", grade: "A"}
_.pick()함수는 객체의 지정된 속성 만 포함하고 다른 모든 속성은 무시하며 해당 객체에서 업데이트 된 복사본을 반환합니다.
var myObject = {'id': '12345', 'subject': 'programming', 'grade': 'A'};
console.log('Original object:', myObject);
var updatedObject = _.pick(myObject, 'id', 'subject')
console.log('Updated object with pick() : ', updatedObject)
console.log('Original object after update:', myObject);
출력:
Original object: {id: "12345", subject: "programming", grade: "A"}
Updated object with pick() : {id: "12345", subject: "programming"}
Original object after update: {id: "12345", subject: "programming", grade: "A"}
여기에서 라이브러리를 가져올 수 있습니다.
spread 구문을 사용하여 JavaScript ECMAScript 6의 객체에서 속성 제거
ECMAScript 6의 JavaScript spread 구문은 원래 객체를 변경하지 않고 JavaScript 객체에서 주어진 속성을 제거하지만 새로 업데이트 된 객체를 반환하는 매우 우아한 방법을 제공합니다.
spread 구문을 사용하면 원래 객체를 두 개의 변수로 분리하는 것처럼 보입니다. 그중 하나는 제거 된 속성이됩니다. 다른 변수는 제거 된 개체없이 원본 개체의 복사본을 보유합니다.
var myObject = {'id': '12345', 'subject': 'programming', 'grade': 'A'};
console.log('Original object:', myObject);
var {grade, ...myUpdatedObject} = myObject;
console.log('The removed \'grade\' property : ', grade)
console.log('Updated object : ', myUpdatedObject)
console.log('Original object after update:', myObject);
출력:
Original object: {id: "12345", subject: "programming", grade: "A"}
The removed 'grade' property : A
Updated object : {id: "12345", subject: "programming"}
Original object after update: {id: "12345", subject: "programming", grade: "A"}