【亡羊补牢】JS灵魂之问 第26期 修炼内功 ES 14种操作对象的方法

引言

本篇要讲解的内容是关于 ES 14种操作对象的方法 ,那今天这篇看能不能问倒你了,一起来探索一下吧。

仰望星空的人,不应该被嘲笑

ES 14种操作对象的方法

获取原型

var obj = {
    
    a:1,b:2};
// 1.获取原型 [[GetPrototypeOf]]
var proto = Object.getPrototypeOf(obj);
console.log(proto);
console.log(obj.__proto__);
console.log(Object.prototype);

打印结果如下:

设置原型

var obj = {
    
     a: 1, b: 2 };
// 2.设置原型 [[SetPrototypeOf]]
Object.setPrototypeOf(obj, {
    
     c: 3, d: 4 });
// 同样也可以采用如下两种方式,直接赋值
// obj.__proro__ = xxx;
// Object.prototype = xxx;
console.log(obj);

打印结果如下:

获取对象的可拓展性

var obj = {
    
     a: 1, b: 2 };
// 3.获取对象的可拓展性 [[IsExtensible]]
var extensible = Object.isExtensible(obj);
console.log(extensible);
// 冻结对象
Object.freeze(obj);
var extensible2 = Object.isExtensible(obj);
console.log(extensible2);

打印结果为 true false

诶,从中我们发现了一个新东西 freeze,作用就是冻结对象,与之相关的还有一个 seal,叫做封闭对象,(简称自闭…开个玩笑^_^),还是举一下例子,对比一下,先来介绍 seal封闭对象:

var obj = {
    
     a: 1, b: 2 };
Object.seal(obj);
obj.c = 3;  // 不可修改
console.log(obj);
delete obj.a; // 不可删除
console.log(obj);
obj.b = 3; // 可写
console.log(obj);

打印结果如下,总结三点:不可修改、不可删除、可写。外加可读。

var obj = {
    
     a: 1, b: 2 };
Object.freeze(obj);
obj.c = 3;  // 不可修改
console.log(obj);
delete obj.a; // 不可删除
console.log(obj);
obj.b = 3; // 不可写
console.log(obj);
for (var key in obj) {
    
    
  console.log(obj[key]);
}

打印结果如下,总结三点:不可修改、不可删除、不可写,仅可读。

获取自有属性

var obj = {
    
     a: 1, b: 2 };
// 4.获取自有属性 [[getOwnProperty]]
Object.setPrototypeOf(obj, {
    
     c: 3, d: 4 });
console.log(Object.getOwnPropertyNames(obj));

答案是 [ 'a', 'b' ]

禁止拓展对象

var obj = {
    
     a: 1, b: 2 };
// 5.禁止拓展对象 [[PreventExtensions]]
Object.preventExtensions(obj);
obj.c = 3;
console.log(obj);
delete obj.a;
console.log(obj);

答案是 { a: 1, b: 2 }{ b: 2 },我们无法对 obj 对象进行拓展,但是可以进行删除操作。简单来说就是禁止增加属性,但可删除属性

拦截对象操作

// var obj = { a: 1, b: 2 };
// 6.拦截对象操作 [[DefineOwnProperty]]
// Object.defineProperty()

判断是否是自身属性

var obj = {
    
     a: 1, b: 2 };
// 7.判断是否是自身属性 [[HasProperty]]
console.log(obj.hasOwnProperty('a'));

答案是 true

获取对象属性

var obj = {
    
     a: 1, b: 2 };
// 8.获取对象属性 [[Get]]
console.log('c' in obj);
console.log('a' in obj);
console.log(obj.a);

打印结果如下:

false
true
1

设置对象属性

var obj = {
    
     a: 1, b: 2 };
// 9.设置对象属性 [[SET]]
obj.a = 3;
obj['b'] = 4;
console.log(obj);

答案{ a: 3, b: 4 }.

删除对象属性

var obj = {
    
     a: 1, b: 2 };
// 10.删除对象属性 [[Delete]]
delete obj.a;
console.log(obj);

答案是 { b: 2 }

枚举对象属性

var obj = {
    
     a: 1, b: 2 };
// 11. 枚举 [[Enumerate]]
for (var k in obj) {
    
    
  console.log(obj[k]);
}
1
2

获取键集合

var obj = {
    
     a: 1, b: 2 };
// 12.获取键集合 [[OwnPropertyKeys]]
console.log(Object.keys(obj));

答案 [ 'a', 'b' ]

调用函数

// 13.调用函数
var obj = {
    
     a: 1, b: 2 };
function test() {
    
     }
test();
obj.test = function () {
    
     }
obj.test();

new实例化对象

// 14.实例化对象
function Test() {
    
     };
new Test();

最后

文章产出不易,还望各位小伙伴们支持一波!

往期精选:

小狮子前端の笔记仓库

访问超逸の博客,方便小伙伴阅读玩耍~

学如逆水行舟,不进则退

猜你喜欢

转载自blog.csdn.net/weixin_42429718/article/details/108716978
今日推荐