JavaScript 对象处理必备：十项实用技巧大揭秘！

一、使用 Object.keys() 获取对象的所有键

Object.keys() 方法返回一个包含对象所有自身可枚举属性的键的数组。

const obj = {name: '张三', age: 25, gender: '男'};
const keys = Object.keys(obj);
console.log(keys); // ['name', 'age', 'gender']
    

二、使用 Object.values() 获取对象的所有值

Object.values() 方法返回一个包含对象所有自身可枚举属性值的数组。

const obj = {name: '张三', age: 25, gender: '男'};
const values = Object.values(obj);
console.log(values); // ['张三', 25, '男']
    

三、使用 Object.entries() 获取对象的键值对数组

Object.entries() 方法返回一个包含对象自身所有可枚举属性的键值对的数组。

const obj = {name: '张三', age: 25, gender: '男'};
const entries = Object.entries(obj);
console.log(entries);
// [['name', '张三'], ['age', 25], ['gender', '男']]
    

四、使用 Object.assign() 合并对象

Object.assign() 方法用于将所有可枚举属性的值从一个或多个源对象复制到目标对象，并返回目标对象。

const obj1 = {name: '张三', age: 25};
const obj2 = {gender: '男', job: '程序员'};
const result = Object.assign({}, obj1, obj2);
console.log(result); // {name: '张三', age: 25, gender: '男', job: '程序员'}
    

五、使用扩展运算符复制对象

扩展运算符（...）可以用于复制对象，但需要注意的是，这种方法只能复制对象的第一层属性。

const obj = {name: '张三', age: 25, info: {job: '程序员'}};
const objCopy = {...obj};
console.log(objCopy); // {name: '张三', age: 25, info: {job: '程序员'}}
    

六、使用深拷贝复制对象

深拷贝可以复制对象的所有层级属性，避免对象之间的引用关系。

function deepClone(obj) {
    if (obj === null || typeof obj !== 'object') {
        return obj;
    }
    let cloneObj = Array.isArray(obj) ? [] : {};
    for (const key in obj) {
        if (obj.hasOwnProperty(key)) {
            cloneObj[key] = deepClone(obj[key]);
        }
    }
    return cloneObj;
}
const obj = {name: '张三', age: 25, info: {job: '程序员'}};
const objCopy = deepClone(obj);
console.log(objCopy); // {name: '张三', age: 25, info: {job: '程序员'}}
    

七、使用 Object.create() 创建对象

Object.create() 方法创建一个新对象，使用现有的对象来提供新创建的对象的原型。

const prototypeObj = {name: '张三'};
const newObj = Object.create(prototypeObj);
newObj.age = 25;
console.log(newObj); // {age: 25}
console.log(newObj.name); // '张三'
    

八、使用原型链继承对象

原型链继承是一种创建对象并实现对象之间继承的方法。

function Parent(name) {
    this.name = name;
}
Parent.prototype.sayName = function() {
    console.log(this.name);
};
function Child(name, age) {
    Parent.call(this, name);
    this.age = age;
}
Child.prototype = new Parent();
Child.prototype.constructor = Child;
Child.prototype.sayAge = function() {
    console.log(this.age);
};
const child = new Child('张三', 25);
child.sayName(); // '张三'
child.sayAge(); // 25
    

九、使用 Object.getOwnPropertyNames() 获取所有自身属性的键名

Object.getOwnPropertyNames() 方法返回一个数组，包含对象自身的所有属性（包括不可枚举的属性）的键名。

const obj = Object.create({}, {
    name: {
        value: '张三',
        enumerable: false
    }
});
const keys = Object.getOwnPropertyNames(obj);
console.log(keys); // ['name']
    

十、使用 Reflect.ownKeys() 获取所有自身属性的键名

Reflect.ownKeys() 方法返回一个数组，包含对象自身的所有属性的键名，不管属性是否可枚举。

const obj = Object.create({}, {
    name: {
        value: '张三',
        enumerable: false
    }
});
const keys = Reflect.ownKeys(obj);
console.log(keys); // ['name']
    

本文由IT视界版权所有,禁止未经同意的情况下转发