JavaScript5种对象的命名属性创建

更新时间:2020-06-18 10:08:55点击次数:291次
本博文源于js基础,主要探讨对象的五种创建方式。分别是:花括号创建、使用点操作符创建、Object的create方法、Object的create方法、Object的defineProperty、defineProperties方法还有通过prototype属性创建。

使用花括号创建
这种方式可类比成java的创建方式。看一个例子就能加深影响:

<script>
var obj = {
v;1.0,
getV:function() {
return this.v;
},
_name:"object",
get name() {
this._name;
}
set name(name){
this._name = name;
}
}
</script>


这里包含直接属性(v)、function对象属性(getV)以及访问器属性(name).

使用点操作符创建
这种我们在其他面向对象的语言中经常使用,只需一个例子点名就行:

var person = {name:"张三"};
person.name = "李四";
person.age = 88;

创建属性,定义属性赋值,如果之前有属性那就修改,如果没有那就添加相应的属性。

Object的create方法
这个前面讲过,可以参考这篇博文:
js|3种方式创建object类型对象(含测试源码)。这种方式有两个参数,第一个参数中的属性为创建的对象[[Prototype]]属性,第二个参数为属性描述对象。

Object的defineProperty、defineProperties方法
我们可以使用Object的defineProperty和defineProperties方法给对象添加属性。defineProperty方法可添加单个属性,defineProperties方法可以添加多个属性。
Object的defineProperty方法一共有三个参数,第一个是要添加属性的对象,第二个是要添加属性的属性名,第三个是属性的描述。先看其使用方式

<script>
var obj = {};
Object.defineProperty(obj,"color",{
enumerable:true,
value:"green"
});
console.log(Object.getOwnPropertyNames(obj));
console.log(obj.color);
</script>



例子中使用defineProperty方法给obj对象添加了color属性。
Object的defineProperties方法可以创建多个属性,它有两个参数,第一个参数是要添加属性的对象,第二个参数是属性描述对象,和create方法中的第二个参数一样,例如下面

<script>
var obj = {};
Object.defineProperties(obj,{
name:{
enumerable:true,
writable:false,
value:"lucy"
},
color: {
enumerable:true;
value:"green"
}
});
console.log(Object.getOwnPropertyNames(obj));
obj.name = "peter";
console.log(obj,name);
</script>


这个例子使用Object的defineProperties方法给obj对象添加了name和color两个属性。在这个例子种,因为name属性的writable为false,所以obj的name属性不可以修改,因此打印lucy。

通过prototype属性创建
关于prototype属性,专门一篇博文谈这个
JavaScript|1篇博文探寻prototype属性与继承
因为此属性function对象的prototype中的属性并不会添加到创建的实例对象中,但创建的对象可以调用,这样就相当于可以将prototype中的属性添加到创建的对象中。 也可以看个例子:

<script>
function Shop(){}
var shop = new Shop();
Shop.prototype.type = "网络销售";
console.log(shop.type);
</script>

本站文章版权归原作者及原出处所有 。内容为作者个人观点, 并不代表本站赞同其观点和对其真实性负责,本站只提供参考并不构成任何投资及应用建议。本站是一个个人学习交流的平台,网站上部分文章为转载,并不用于任何商业目的,我们已经尽可能的对作者和来源进行了通告,但是能力有限或疏忽,造成漏登,请及时联系我们,我们将根据著作权人的要求,立即更正或者删除有关内容。本站拥有对此声明的最终解释权。

  • 项目经理 点击这里给我发消息
  • 项目经理 点击这里给我发消息
  • 项目经理 点击这里给我发消息
  • 项目经理 点击这里给我发消息