Home > Web Front-end > JS Tutorial > body text

A Guide to Master JavaScript-Objects

WBOY
Release: 2024-07-18 16:46:17
Original
125 people have browsed it

A Guide to Master JavaScript-Objects

객체는 JavaScript의 기본 부분으로, 데이터 저장 및 관리를 위한 백본 역할을 합니다. 객체는 속성의 컬렉션이며 각 속성은 키(또는 이름)와 값 간의 연결입니다. 객체를 생성, 조작 및 활용하는 방법을 이해하는 것은 모든 JavaScript 개발자에게 중요합니다. 이 글에서는 JavaScript의 다양한 개체 기능을 살펴보고 이를 익히는 데 도움이 되는 자세한 설명, 예제 및 설명을 제공합니다.

JavaScript의 객체 소개

JavaScript에서 객체는 데이터 컬렉션과 더 복잡한 엔터티를 저장하는 데 사용됩니다. 객체 리터럴이나 객체 생성자를 사용하여 생성됩니다.

으아아아

개체 속성

  • Object.prototype: 모든 JavaScript 개체는 프로토타입에서 속성과 메서드를 상속합니다.
으아아아

객체 메소드

1.객체.할당()

하나 이상의 소스 객체에서 열거 가능한 모든 자체 속성 값을 대상 객체로 복사합니다. 대상 객체를 반환합니다.

으아아아

2.객체.생성()

지정된 프로토타입 개체와 속성을 사용하여 새 개체를 만듭니다.

으아아아

3. 객체 정의속성()

객체에서 직접 새 속성을 정의하거나 기존 속성을 수정하여 객체를 반환합니다.

으아아아

4. 객체 정의속성()

객체에 직접 새 속성을 정의하거나 기존 속성을 수정하고 객체를 반환합니다.

으아아아

5. 객체.항목()

주어진 객체의 열거 가능한 문자열 키 속성 [키, 값] 쌍의 배열을 반환합니다.

으아아아

6. 객체.동결()

객체를 고정합니다. 고정된 개체는 더 이상 변경할 수 없습니다. 개체를 고정하면 새 속성이 개체에 추가되거나 기존 속성이 제거되거나 기존 속성 값이 변경되는 것을 방지할 수 있습니다.

으아아아

7. 객체.fromEntries()

키-값 쌍 목록을 객체로 변환합니다.

으아아아

8. Object.getOwnPropertyDescriptor()

주어진 객체의 자체 속성(즉, 객체의 프로토타입 체인이 아닌 객체에 직접 존재하는 속성)에 대한 속성 설명자를 반환합니다.

으아아아

9. Object.getOwnPropertyDescriptors()

객체의 모든 속성 설명자를 포함하는 객체를 반환합니다.

으아아아

10. 객체.getOwnPropertyNames()

주어진 객체에서 직접 발견된 모든 속성(Symbol을 사용하는 속성을 제외한 열거 불가능한 속성 포함)의 배열을 반환합니다.

으아아아

11. Object.getOwnPropertySymbols()

주어진 객체에서 직접 발견된 모든 기호 속성의 배열을 반환합니다.

으아아아

12. 객체.getPrototypeOf()

지정된 개체의 프로토타입(즉, 내부 [[Prototype]] 속성 값)을 반환합니다.

으아아아

13. 객체.is()

두 값이 같은 값인지 확인합니다.

으아아아

14. Object.isExtensible()

객체 확장이 허용되는지 결정합니다.

으아아아

15. 객체.isFrozen()

물체가 얼어붙었는지 확인합니다.

으아아아

16. 객체.isSealed()

물체가 밀봉되었는지 확인합니다.

으아아아

17. 객체.키()

일반 루프와 동일한 순서로 반복되는 특정 객체의 열거 가능한 속성 이름 배열을 반환합니다.

으아아아

18. Object.preventExtensions()

객체의 확장을 방지합니다.

으아아아

19. 객체.씰()

객체를 봉인하여 새 속성이 객체에 추가되는 것을 방지하고 모든 기존 속성을 구성 불가능으로 표시합니다. 현재 속성의 값은 쓰기 가능한 한 계속 변경할 수 있습니다.

으아아아

20. Object.setPrototypeOf()

지정된 개체의 프로토타입(즉, 내부 [[Prototype]] 속성)을 다른 개체 또는 null로 설정합니다.

으아아아

21. 객체.값()

for...in 루프에서 제공하는 것과 동일한 순서로 특정 객체의 열거 가능한 속성 값 배열을 반환합니다.

으아아아

실제 사례

예 1: 객체 복제

객체를 복제하려면 Object.sign()을 사용하세요.

으아아아

예 2: 객체 병합

객체를 병합하려면 Object.sign()을 사용하세요.

let obj1 = {a: 1, b: 2};
let obj2 = {b: 3, c: 4};
let merged = Object.assign({},

 obj1, obj2);
console.log(merged); // Output: {a: 1, b: 3, c: 4}
Copy after login

Example 3: Creating an Object with a Specified Prototype

Using Object.create() to create an object with a specified prototype.

let proto = {greet: function() { console.log("Hello!"); }};
let obj = Object.create(proto);
obj.greet(); // Output: Hello!
Copy after login

Example 4: Defining Immutable Properties

Using Object.defineProperty() to define immutable properties.

let obj = {};
Object.defineProperty(obj, 'immutableProp', {
    value: 42,
    writable: false
});
console.log(obj.immutableProp); // Output: 42
obj.immutableProp = 77; // Throws an error in strict mode
console.log(obj.immutableProp); // Output: 42
Copy after login

Example 5: Converting an Object to an Array

Using Object.entries() to convert an object to an array of key-value pairs.

let obj = {a: 1, b: 2, c: 3};
let entries = Object.entries(obj);
console.log(entries); // Output: [['a', 1], ['b', 2], ['c', 3]]
Copy after login

Conclusion

Objects are a core component of JavaScript, offering a flexible way to manage and manipulate data. By mastering object functions, you can perform complex operations with ease and write more efficient and maintainable code. This comprehensive guide has covered the most important object functions in JavaScript, complete with detailed examples and explanations. Practice using these functions and experiment with different use cases to deepen your understanding and enhance your coding skills.

The above is the detailed content of A Guide to Master JavaScript-Objects. For more information, please follow other related articles on the PHP Chinese website!

source:dev.to
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!