js对象的各种方法

2024-01-31 13:01:36 浏览数 (2)

总结几个不太熟练的js对象方法。

Object.hasOwnProperty()

检测当前对象是否具备这个属性, 但是不会读取原型上的属性

代码语言:javascript复制
function Person(age) {
this.age = age;
}
Person.prototype.gender = 'male';
let p = new Person(20);
p.address = 'xxx';
console.log(p.hasOwnProperty('age')); // true
console.log(p.hasOwnProperty('gender')); // false
console.log(p.hasOwnProperty('address')); // true

isPrototypeOf()

isPrototypeOf() 是 Object函数(类)下的一个方法,用于判断当前对象是否为另外一个对象的原型,如果是就返回 true,否则就返回 false。
代码语言:javascript复制
const sourceObj = { name1: 'yyy' };
const targetObj = Object.create(sourceObj);
console.log(sourceObj.isPrototypeOf(targetObj));

这里的create方法是以sourceObj为targetObj的原型对象创建一个新的空对象,我用这个来验证sourceObj是不是targetObj的原型对象,结果为true

Object.defineProperty()

定义对象属性

语法:Object.defineproperty(哪一个对象,属性名,{配置项})

配置项:

  • value:该属性对应值
  • writable:该属性确定是否允许被重写,默认值是false
  • emunerable:该属性是否可被枚举(遍历), 默认是 false
  • get:是一个函数,叫做getter获取器,可以用来决定该属性的属性值.,get属性的返回值就是当前属性的属性值
  • set:是一个函数,叫做setter设置器,当修改属性值的时候会触发函数set和get不能和其他三个属性一起用
代码语言:javascript复制
let obj = { name: 'yft', age: 20 };
let objCopy = {};
for (let key in obj) {
Object.defineProperty(objCopy, key, { value: obj[key], enumerable: false });
} // 空的,因为不可迭代
Object.defineProperties()
定义多个属性
代码语言:javascript复制
let obj1 = { name: 'yft' };
Object.defineProperties(obj1, {
age: { value: 20, enumerable: true },
gender: { value: 'female', enumerable: true },
});
obj1; // { name: 'yft', age: 20, gender: 'female' }

Object.assign(目标对象,源对象)

可以用作浅拷贝,合并
代码语言:javascript复制
let obj = {
name: 'yft',
age: 20,
info: {
subject: 'Math',
},
};
const assignObj = {};
Object.assign(assignObj, obj);
assignObj; //{ name: 'yft', age: 20, info: { subject: 'Math' } }
assignObj.info.subject = 'English';
assignObj; // { name: 'yft', age: 20, info: { subject: 'English' } }
obj;// { name: 'yft', age: 20, info: { subject: 'English' } }

如果目标对象自身有属性,那么会合并

代码语言:javascript复制
let obj = {
name: 'yft',
age: 20,
info: {
subject: 'Math',
},
};
const assignObj = { gender: 'female' };
assignObj; // { gender: 'female', name: 'yft', 
           //   age: 20, info: { subject: 'Math' } }

如果有同名属性,目标对象中的值会被源对象的值覆盖掉

代码语言:javascript复制
let obj = {
name: 'yft',
age: 20,
info: {
subject: 'Math',
},
};
const assignObj = { age: '30' };
assignObj; // { age: 20, name: 'yft', info: { subject: 'Math' } }
Object.create()

Object.create() 静态方法以一个现有对象作为原型,创建一个新对象。

代码语言:javascript复制
let obj1 = { name: 'yft' };
const newObj = Object.create(obj1);
console.log(newObj.hasOwnProperty('name')); // false
console.log(Object.getPrototypeOf(newObj));// { name: 'yft' }
Object.entries()

Object.entries() 静态方法返回一个数组,包含给定对象自有的可枚举字符串键属性的键值对。

代码语言:javascript复制
let obj2 = Object.defineProperties(
{ gender: 'female' },
{
name: { value: 'yft', enumerable: true },
age: { value: 20, enumerable: true },
score: {subject: 'Math'} // 注意此处的score默认是不可枚举的
}
);
console.log(Object.entries(obj2));
// [ [ 'gender', 'female' ], [ 'name', 'yft' ], [ 'age', 20 ] ]
// 由于score是不可枚举的,因此不会被返回
Object.getPrototypeOf()

返回一个对象的原型对象,其实就是一个对象的_proto_ ,但是优于_proto_ ,因为在某些情况下会用不了

代码语言:javascript复制
function User(name) {
this.name = name;
}
User.prototype.gender = 'female';
var u = new User('sfalken');
console.log(Object.getPrototypeOf(u)); //{ gender: 'female' }
console.log(User.prototype === Object.getPrototypeOf(u)); // true
Object.setPrototypeOf()

Object.setPrototypeOf() 静态方法可以将一个指定对象的原型(即内部的 [[Prototype]] 属性)设置为另一个对象或者 null。

代码语言:javascript复制
let obj3 = {};
let foo = { name: '123' };
Object.setPrototypeOf(obj3, foo);
console.log(obj3);
console.log(obj3.hasOwnProperty('name')); // false
console.log(obj3.hasOwnProperty('gender')); // true
console.log(obj3.name); // '123'
Object.freeze()

Object.freeze() 静态方法可以使一个对象被冻结。冻结对象可以防止扩展,并使现有的属性不可写入和不可配置。被冻结的对象不能再被更改:不能添加新的属性,不能移除现有的属性,不能更改它们的可枚举性、可配置性、可写性或值,对象的原型也不能被重新指定。freeze() 返回与传入的对象相同的对象。

冻结一个对象是 JavaScript 提供的最高完整性级别保护措施。

代码语言:javascript复制
let obj2 = Object.defineProperties(
{ gender: 'female' },
{
name: { value: 'yft', enumerable: true },
age: { value: 20, enumerable: true },
score: { subject: 'Math' },
}
);
obj2;
Object.freeze(obj2);
obj2.name = '111';
delete obj2.gender;
console.log(obj2); // { gender: 'female', name: 'yft', age: 20 }

0 人点赞