es5 Object方法添加属性和原型

秒速五厘米 2021-07-24 12:34 533阅读 0赞

ES5 Object对象方法扩展
    
    	(1)var 对象=Object.create(指定对象,{配置对象});
    		
    		1、指定对象将会作为赋值对象的原型
    		2、配置对象中的属性将会称为赋值对象的属性
    		3、配置对象中，属性名:{配置信息}
    			value:属性值
    			writable:true/false 是否可修改,默认为false
    			configurable: true/false 当前属性是否可被删除,默认为false
    			enumerable：true/fasle 是否可以能用 for in 枚举，默认为false
    	
    	(2)Object.defineProperties(指定对象,{属性名:配置对象})
    
    	    1、为指定对象定义扩展多个属性
    	    2、get:function(){}   用来获取当前属性值的回调函数,即obj.属性名
    	    3、set：function(外部修改变化的值){}  修改当前属性值触发的回调函数,即obj.属性名=xx;
    	    4、this指向指定对象
    	    5、配置对象中定义的属性只能通过get来获取,并且无法被修改
    
    	 (3)对象本身的set、get方法,效果和(2)一样
    	 	var obj={
    			xxx
    			get 扩展属性名(){return xxx};
    			set 扩展属性名(外部修改的值内容){xxx};
    	 	}

代码示例:

<html ng-app='app' ng-controller='main' >
    <head>
    	<meta charset="utf-8">
    	<meta name='viewport' content='width=device-width,user-scalable=no,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0'>
    
    	<script src='jq/jquery-3.4.1.js'></script>
    
    	<style>
    
    	</style>
    </head>
    <body >
    
    
    
    
    <script>
     'use strict'
    
     	var obj={ uname:'jeff',age:30};
     	var obj1={ };
     	obj1=Object.create(obj,{ sex:{ 
     		value:'male',
     		writable:true,
     		configurable:true,
     		enumerable:true
     	}
    
     });
     	console.log(obj1);
     	obj1.sex='famale';
     	console.log(obj1);
    
     	for(var i in obj1)
     	{ 
     		console.log(i);
     	}
    
     	var obj2={ name:'mike',age:'20'};
     	Object.defineProperties(obj2,{ 
     		address:{ get:function(){ return this.name+'me'},
     				 set:function(data){ console.log(data)
     					var names=data.split(' ');
     					this.firstname=names[1];
     					this.age=names[2];}
    
     				}
     	})
     	console.log(obj2);
     	obj2.address='you me';
    
    
    </script>
    </body>
    </html>