JavaScript之Object对象方法

简介：

本片文章，参考web开发，MDN。我只是记下一阅读笔记，提高自己的记忆，好记性不如烂笔头；

Object.create()

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

var person = {
    interest: 'play'
}

var liu = Object.create(person);

console.log(liu.interest); 

// play

liu.interest = 'study';

console.log(liu.interest);

// study

Object.definePropertiese()

Object.defineProperties() 方法直接在一个对象上定义新的属性或修改现有属性，并返回该对象。

var person = {
    interest: 'play'
}

var liu = Object.defineProperties(person, {
    name: {
        configurable: true,
        value: "Mr.liu",
        writable: true,
        enumerable: true
    }
});

- configurable : true表示该属性是否允许可以修改，删除，默认是false;
- writable：true当且仅当与该属性相关联的值可以用assignment operator(赋值运算符)改变时。 默认是false;
- value: 与属性关联的值，默认是undefined;
- enumerable：true 当且仅当在枚举相应对象上的属性时该属性显现。 默认是false;

console.log(person.name);

console.log(liu.name);

Object.assign()

用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。它将返回目标对象。

const target = { a: 1, b: 2 };
const source = { b: 4, c: 5 };

const returnedTarget = Object.assign(target, source);

console.log(target);
// expected output: Object { a: 1, b: 4, c: 5 }

console.log(returnedTarget);
// expected output: Object { a: 1, b: 4, c: 5 }

使用Object.defineProperties()，设置d属性不可枚举，如下：

const target = { a: 1, b: 2 };
const source = { b: 4, c: 5 };

Object.defineProperties(target, {
    d: {
        value: 666,
        configurable: true,
        enumerable: false,
        writable: true
    }
})

const returnedTarget = Object.assign(target, source);

console.log(target);
// expected output: Object { a: 1, b: 4, c: 5 }

console.log(returnedTarget);
// expected output: Object { a: 1, b: 4, c: 5 }

设置d属性可以枚举，如下：

const target = { a: 1, b: 2 };
const source = { b: 4, c: 5 };

Object.defineProperties(target, {
    d: {
        value: 666,
        configurable: true,
        enumerable: true,
        writable: true
    }
})

const returnedTarget = Object.assign(target, source);

console.log(target);
// expected output: Object { a: 1, b: 4,d:666, c: 5 }

console.log(returnedTarget);
// expected output: Object { a: 1, b: 4,d:666, c: 5 }

针对深拷贝，需要使用其他办法（JSON.parse(JSON.stringify())），因为 Object.assign()拷贝的是属性值。假如源对象的属性值是一个对象的引用，那么它也只指向那个引用。

合并相同属性名的时候

const o1 = { a: 1, b: 1, c: 1 };
const o2 = { b: 2, c: 2 };
const o3 = { c: 3 };

const obj = Object.assign({}, o1, o2, o3);
console.log(obj); // { a: 1, b: 2, c: 3 }

属性被后续参数中具有相同属性的其他对象覆盖

继承属性和不可枚举的属性是不可以拷贝的

const obj = Object.create({foo: 1}, { // foo 是个继承属性。
    bar: {
        value: 2  // bar 是个不可枚举属性。
    },
    baz: {
        value: 3,
        enumerable: true  // baz 是个自身可枚举属性。
    }
});

const copy = Object.assign({}, obj);
console.log(copy); // { baz: 3 }

Object.entries()

返回一个给定对象自身 可枚举属性 的 键值对数组，其排列与使用 for…in 循环遍历该对象时返回的顺序一致（区别在于 for-in 循环也枚举原型链中的属性）。

let person = {
    name: 'liu',
    age: '12'
}

let propsArr = Object.entries(person);

console.log(propsArr)

// [ [ 'name', 'liu' ], [ 'age', '12' ] ]

for (const [key, value] of propsArr) {
    console.log(`${key}-${value}`)
}

// name-liu 
// age-12

Object.freeze()

冻结一个对象。一个被冻结的对象再也不能被修改；冻结了一个对象则不能向这个对象添加新的属性，不能删除已有属性，不能修改该对象已有属性的可枚举性、可配置性、可写性，以及不能修改已有属性的值。此外，冻结一个对象后该对象的原型也不能被修改。freeze() 返回和传入的参数相同的对象。

let person = {
    name: 'liu',
    age: '12'
}

Object.freeze(person);

person.age = '16';

console.log(person);

// { name: 'liu', age: '12' }

Object.getOwnPropertyDescriptor()

返回指定对象上一个自有属性对应的属性描述符。（自有属性指的是直接赋予该对象的属性，不需要从原型链上进行查找的属性）

let person = {
    name: 'liu',
    age: '12'
}

let desc = Object.getOwnPropertyDescriptor(person, "name");

console.log(desc);

// { value: 'liu',
//   writable: true,
//   enumerable: true,
//   configurable: true }

Object.getOwnPropertyNames()

返回一个由指定对象的所有自身属性的属性名（包括不可枚举属性但不包括Symbol值作为名称的属性）组成的数组。

let person = {
    name: 'liu',
    age: '12',
}

let names = Object.getOwnPropertyNames(person);

console.log(names);

// [ 'name', 'age' ]

Object.getPrototypeOf()

返回指定对象的原型

let person = {
    name: 'liu',
    age: '12',
}

let obj = Object.getPrototypeOf(person);

console.log(obj);

// {}

let person1 = Object.create(person);

let obj1 = Object.getPrototypeOf(person1);
console.log(obj1 === person);

// true

Object.is()

判断两个值是否是相同的值。

这种相等性判断逻辑和传统的 == 运算不同，== 运算符会对它两边的操作数做隐式类型转换（如果它们类型不同），然后才进行相等性比较，（所以才会有类似 “” == false 等于 true 的现象），但 Object.is 不会做这种类型转换。

这与 === 运算符的判定方式也不一样。=== 运算符（和== 运算符）将数字值 -0 和 +0 视为相等，并认为 Number.NaN 不等于 NaN。

Object.is('foo', 'foo');     // true
Object.is(window, window);   // true

Object.is('foo', 'bar');     // false
Object.is([], []);           // false

var foo = { a: 1 };
var bar = { a: 1 };
Object.is(foo, foo);         // true
Object.is(foo, bar);         // false

Object.is(null, null);       // true

// 特例
Object.is(0, -0);            // false
Object.is(0, +0);            // true
Object.is(-0, -0);           // true
Object.is(NaN, 0/0);         // true

Object.keys()

一个表示给定对象的所有可枚举属性的字符串数组。

let person = {
    name: 'liu',
    age: '12',
}

Object.defineProperties(person, {
    sex: {
        value: 'boy',
        enumerable: true,
    }
})

let keys = Object.keys(person);

console.log(keys);

// [ 'name', 'age', 'sex' ]

Object.seal()

封闭一个对象，阻止添加新属性并将所有现有属性标记为不可配置。当前属性的值只要可写就可以改变。

不可写：

let person = {
    name: 'liu',
    age: '12',
}

Object.defineProperties(person, {
    sex: {
        value: 'boy',
        enumerable: true,
        writable: false,
    }
})

console.log(person);


Object.seal(person);

person.sex = 'girl';

console.log(person)

// { name: 'liu', age: '12', sex: 'boy' }
// { name: 'liu', age: '12', sex: 'boy' }

可写：

let person = {
    name: 'liu',
    age: '12',
}

Object.defineProperties(person, {
    sex: {
        value: 'boy',
        enumerable: true,
        writable: true,
    }
})

console.log(person);


Object.seal(person);

person.sex = 'girl';

console.log(person)

// { name: 'liu', age: '12', sex: 'boy' }
// { name: 'liu', age: '12', sex: 'girl' }

Object.values()

方法返回一个给定对象自身的所有可枚举属性值的数组，值的顺序与使用for…in循环的顺序相同 ( 区别在于 for-in 循环枚举原型链中的属性 )。

let person = {
    name: 'liu',
    age: '12',
}

let values = Object.values(person);

console.log(values);

// [ 'liu', '12' ]

文章参考来源： MDN