1.对象的创建和应用

1----对象的创建

1-以前的创建

		//字面量创建法
        var obj={a:1,b:2};
        console.log(obj);

        //构造函数创建法
        var obj=new Object();
        obj.a=1;
        obj.b=2;

2-通过方法创建 _ proto _ 原型链属性
根据空对象或者根据已有对象创建

		var obj={a:1,b:2};
		var obj1=Object.create({});//根据空对象创建
        var obj1=Object.create(obj);//根据已有对象创建
        console.log(obj1)


2–原型属性和对象属性

__proto__原型链属性
如果有对象属性,则获取的是对象属性,如果没有对象属性,就会获取距离该对象最近的原型链属性
设置属性时,只会设置对象属性,不能设置原型链属性

var obj={a:1,b:2};
var obj1=Object.create(obj);
console.log(obj1.b)  //2   obj1的原型obj上有b属性
obj1.b=10;//设置的是对象属性,不能修改原型链上的属性
console.log(obj1.b)//10  获取的是对象上的属性
var obj2=Object.create(obj1);
console.log(obj2.b); //10 获取的是原型obj1的对象属性


3-修改原型属性

1-------修改继承该对象原对象的属性

var obj={a:1,b:2};
var obj1=Object.create(obj);
console.log(obj1.b)  //2   obj1的原型obj上有b属性
obj1.b=10;//设置的是对象属性,不能修改原型链上的属性
console.log(obj1.b)//10  获取的是对象上的属性
var obj2=Object.create(obj1);
console.log(obj2.b); //10 获取的是原型obj1的对象属性


obj.b=-10;//修改原对象的属性,obj1和obj2 继承的原型上的属性值就会改变
console.log(obj1);
console.log(obj2);

2----使用__proto__修改,禁止使用这种方式进行修改

        obj2.__proto__.__proto__.b=-100;
        // obj2.__proto__是obj1    obj2.__proto__.__proto__是obj
        console.log(obj);
        console.log(obj1);
        console.log(obj2);

可以使用__proto__获取原型属性,不能修改

//点击按钮,让按钮显示对象的值
<button></button>
<script>
        var obj={a:1,b:2};
        var obj1=Object.create(obj);

        var bn=document.querySelector("button");
        bn.addEventListener("click",clickHandler);

        function clickHandler(e){
            obj1.b++;//obj1.b的初始值是2,获取的是原型obj上的b属性,在这里只能获取,当obj1.b++变为3的时候,把3设置给了obj1,修改的是obj1上的b,obj上的属性不变
            if(obj1.b>=10) obj1.b=obj1.__proto__.b;
            //if(obj1.b>=10) delete obj1.b; //对象属性删除之后再次点击获取的是原型上的属性
            this.textContent=obj1.b;
        }
</script>



4—删除对象属性 delete

对象只能删除对象属性,不能删除原型属性

		var obj={a:2};
        delete obj.a;

当一个对象的属性中有另一个对象时,有两个__propto__,当删除了对象的属性a时,该属性对应的对象obj1的引用还没有删除,所以还得清除a下面的对象

		var obj={};
        var obj1={b:2};
        obj.a=obj1;
        console.log(obj);
        delete obj.a;
        obj1=null;

如果只删除a属性,不清除{b:2}对象的话,{b:2}会被常驻内存,造成内存泄漏

		var obj={a:{b:2}};
        obj.a=null;//防止内存泄漏,需要将obj.a设置为null,
        delete obj.a;//然后再删除该属性


5-----Object.create 和 Object.assign的区别

Object.assign(目标对象,源对象1,源对象2。。。); 返回目标对象
Object.assign是不能创建对象的,必须拥有目标对象才能创建,Object.create是可以创建对象的

Object.assign

只能复制对象属性,不能复制对象的原型链属性
只能复制可枚举类型
引用关系也会一同被复制,只能浅复制
多个源对象复制时,如果有相同的属性,后面的将会覆盖前面的

//1---
 		var obj1={};//obj1必须先创建存在的
        obj1=Object.assign(obj1,obj);//这里obj1可以不用返回,直接对应的就是上面的obj1对象
//2----
        var obj1=Object.assign({},obj);//先创建了一个空对象,然后将obj复制到这个空对象上
        //{}返回给obj1
//3-----
		var obj={a:1,b:2};
        var obj1={b:3,c:10};
        var obj2=Object.assign({},obj1,obj);
        console.log(obj2);//{a:1,b:3,c:10}  后面的会覆盖前面的属性
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

胡萝卜大王驾到通通闪开

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值