资讯专栏INFORMATION COLUMN

javascript中对象的常用方法,深克隆和浅克隆以及冻结,扩展,密封三大属性的区别

gplane / 2167人阅读

摘要:它将返回目标对象。封闭对象方法判断一个对象是否被密封。为源对象为修改的属性名或设置,同上方法返回一个给定对象自身可枚举属性的键值对数组方法返回指定对象上一个自有属性对应的属性描述符方法判断两个值是否是相同的值。

对象作为引用类型,工作中免不了复制对象,下面来看看克隆的方法
Object.assign() 方法用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。它将返回目标对象。浅克隆:
const obj1 = {
    a: 1,
    b: 2,
    title: {
        name: "张三"
    }
};
const obj2 = Object.assign({}, obj1);
console.log(obj2); //{ a: 1, b: 2 ,title:{name:"张三"}}
obj1.title.name = "李四";  //修改obj1的值,再来打印看下obj2的值
console.log(obj2)   //{ a: 1, b: 2,title:{name:"李四"} }
console.log(obj1)  //{ a: 1, b: 2,title:{name:"李四"} }
Object深克隆的一种方式,主要方式是把对象转为JSON字符串,然后再转为对象
var cloneObj = JSON.parse(JSON.stringify(obj)); 
对象中有冻结,扩展,密封三大属性,freeze,seal,preventExtensions,来看看3个属性的区别
Object.freeze(obj) 方法可以冻结一个对象,不能修改,新增,删除任何属性和值
let freeze1 = {
    a: "1"
};
let freeze2 = Object.freeze(freeze1);
freeze2.a = 2;
console.log(freeze2) //1 
Object.isFrozen(obj) 方法判断对象是否被冻结
console.log(Object.isFrozen(freeze2))   //true
Object.seal(obj) 方法封闭一个对象,阻止添加新属性并将所有现有属性标记为不可配置。当前属性的值只要可写就可以改变。
let seal = {};
Object.seal(seal);  //封闭对象
Object.isSealed(obj) 方法判断一个对象是否被密封。
console.log(Object.isSealed({}), "------"); //false
console.log(Object.isSealed(seal), "------"); //true
Object.preventExtensions(obj) 方法让一个对象变的不可扩展,也就是永远不能再添加新的
Object.isExtensible(obj) 法判断一个对象是否是可扩展的是否可以在它上面添加新的属性。
对象可枚举属性和不可枚举属性,一直傻傻分不清,在javascript中,对象的属性氛围可枚举和不可枚举之分,属性的枚举性主要影响一下三个函数的结果,
for ...in 
Object.keys()
JSON.stringify()

先看一个例子,创建一个对象

function Person() {
    this.name = "KEY"
}

Person.prototype = {
    constructr: Person,
    jos: "student"
};

var key = new Person();
Object.defineProperty(key, "sex", {
    value: "female"
})
console.log(key.sex, "------") //female ------  直接访问可以获取的key.sex
for (var pro in key) {         //遍历无法打印不可枚举对象
    console.log("pro:" + pro + ";" + key[pro])
}
 pro:name;KEY    
 pro:constructr;function Person(){
     this.name="KEY"
 }
 pro:jos;student
obj.propertyIsEnumerable(prop) 方法返回一个布尔值,表示指定的属性是否可枚举
console.log(Number.propertyIsEnumerable("parseint")) //false
Object.defineProperties();方法直接在一个对象上定义新的属性或修改现有属性,并返回该对象。
Object.defineProperties(obj, props) 
*obj 为源对象
*props是一个对象,里面有configurable,enumerable,value,writable,get,set
*configurable 属性描述符的类型可以被改变并且该属性可以从对应对象中删除。默认false
*enumerable 是否为枚举属性  默认为false
*value 任意值,默认undefined
*writable 可以通过赋值改变  默认false
*get 返回value值,默认undefinde
*set 设置value值,默认undefine

var defind = {};
Object.defineProperties(defind, {
    "v1": {
        value: "12"
    }
});
console.log(defind.v1) //12
Object.defineProperty() 方法会直接在一个对象上定义一个新属性,或者修改一个对象的现有属性, 并返回这个对象。
Object.defineProperty(obj,name, prop)  
*obj 为源对象  name为修改的属性名或设置,prop同上

Object.defineProperty(defind, "key", {
    enumerable: false,
    configurable: false,
    writable: false,
    value: "static"
});
Object.entries() 方法返回一个给定对象自身可枚举属性的键值对数组
Object.getOwnPropertyDescriptor(obj, prop) //方法返回指定对象上一个自有属性对应的属性描述符
console.log(Object.getOwnPropertyDescriptor(freeze1, "a"));
{ value: "1",
 writable: false,
enumerable: true,
 configurable: false }
Object.is(value1, value2)方法判断两个值是否是相同的值。
console.log(Object.is({}, {})); //false
console.log(Object.is([], {})); //false
console.log(Object.is([], [])); //false
obj.hasOwnProperty(prop) 检查对象有没有该属性
var o = {
    prop: "exists"
};
console.log(o.hasOwnProperty("prop"));             // 返回 true
console.log(o.hasOwnProperty("hasOwnProperty"));   // 返回 false

每天进步一点,希望大家喜欢,也希望喜欢的朋友点个赞,后续继续更新...

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/93595.html

相关文章

  • javascript对象、类与原型链

    摘要:下面定义一个构造函数不过这样写这个函数,每个对象都会包括一部分,太浪费内存。原型链与继承在学习原型链之前我们一定要区分清楚是构造函数的属性,而是对象的属性。但对象形式不等于基本类型。用来判断对象是否某个构造函数的实例。 js是一个基于对象的语言,所以本文研究一下js对象和类实现的过程和原理。 对象的属性及属性特性 下面是一个对象的各个部分: var person = { name:...

    adam1q84 评论0 收藏0
  • 浅谈 JS 对象扩展密封冻结三大特性

    摘要:尝试删除一个密封对象的属性或者将某个密封对象的属性从数据属性转换成访问器属性,结果会静默失败或抛出异常严格模式。 扩展特性 Object.isExtensible 方法 Object.preventExtensions 方法 密封特性 Object.isSealed 方法 Object.seal 方法 冻结特性 Object.isFrozen 方法 Object...

    ChristmasBoy 评论0 收藏0
  • JAVA面试题(16)

    摘要:为什么要使用克隆克隆对象可能包括已经修改过的属性,出来的对象属性都还是初始化的值。 为什么要使用克隆? 克隆对象可能包括已经修改过的属性,new出来的对象属性都还是初始化的值。 若直接利用指针指向原有对象,改变原对象的属性值时,指针所指对象的值也会改变 clone复制的对象与原对象是相互独立存在 如何实现对象克隆? 克隆主要分为浅克隆和深克隆 步骤 被复制类需实现Cl...

    JouyPub 评论0 收藏0
  • js对象详解(JavaScript对象度剖析,度理解js对象)

    摘要:对象详解对象深度剖析,深度理解对象这算是酝酿很久的一篇文章了。用空构造函数设置类名每个对象都共享相同属性每个对象共享一个方法版本,省内存。 js对象详解(JavaScript对象深度剖析,深度理解js对象) 这算是酝酿很久的一篇文章了。 JavaScript作为一个基于对象(没有类的概念)的语言,从入门到精通到放弃一直会被对象这个问题围绕。 平时发的文章基本都是开发中遇到的问题和对...

    CatalpaFlat 评论0 收藏0
  • JS浅拷贝

    摘要:引用类型之所以会出现深浅拷贝的问题,实质上是由于对基本类型和引用类型的处理不同。另外方法可以视为数组对象的浅拷贝。上面描述过的复杂问题依然存在,可以说是最简陋但是日常工作够用的深拷贝方式。 一直想梳理下工作中经常会用到的深拷贝的内容,然而遍览了许多的文章,却发现对深拷贝并没有一个通用的完美实现方式。因为对深拷贝的定义不同,实现时的edge case过多,在深拷贝的时候会出现循环引用等问...

    xiaoxiaozi 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<