一種新的javascript對象創(chuàng)建方式Object.create()
更新時間：2015年12月28日 17:16:56 作者：yupeng
這篇文章主要介紹了一種新的javascript對象創(chuàng)建方式Object.create()，感興趣的小伙伴們可以參考一下
Object.create() 是什么？
Object.create(proto [, propertiesObject ]) 是E5中提出的一種新的對象創(chuàng)建方式，第一個參數(shù)是要繼承的原型，如果不是一個子函數(shù)，可以傳一個null，第二個參數(shù)是對象的屬性描述符，這個參數(shù)是可選的。
例如：
function Car (desc) {
this.desc = desc;
this.color = "red";
}
Car.prototype = {
getInfo: function() {
return 'A ' + this.color + ' ' + this.desc + '.';
}
};
//instantiate object using the constructor function
var car = Object.create(Car.prototype);
car.color = "blue";
alert(car.getInfo());
結果為:A blue undefined.
1、propertiesObject 參數(shù)的詳細解釋：（默認都為false）
數(shù)據(jù)屬性：
- writable:是否可任意寫
- configurable：是否能夠刪除，是否能夠被修改
- enumerable：是否能用 for in 枚舉
- value：值
訪問屬性：
- get(): 訪問
- set(): 設置
2、例子：直接看例子就知道怎么用?！?/strong>
<!DOCTYPE html>
<html>
<head>
<title>yupeng's document </title>
<meta charset="utf-8"/>
</head>
<body>
<script type="text/javascript">
var obj = {
a:function(){
console.log(100)
},
b:function(){
console.log(200)
},
c:function(){
console.log(300)
}
}
var newObj = {};
newObj = Object.create(obj,{
t1:{
value:'yupeng',
writable:true
},
bar: {
configurable: false,
get: function() { return bar; },
set: function(value) { bar=value }
}
})
console.log(newObj.a());
console.log(newObj.t1);
newObj.t1='yupeng1'
console.log(newObj.t1);
newObj.bar=201;
console.log(newObj.bar)
function Parent() { }
var parent = new Parent();
var child = Object.create(parent, {
dataDescriptor: {
value: "This property uses this string as its value.",
writable: true,
enumerable: true
},
accessorDescriptor: {
get: function () { return "I am returning: " + accessorDescriptor; },
set: function (val) { accessorDescriptor = val; },
configurable: true
}
});
child.accessorDescriptor = 'YUPENG';
console.log(child.accessorDescriptor);
var Car2 = function(){
this.name = 'aaaaaa'
} //this is an empty object, like {}
Car2.prototype = {
getInfo: function() {
return 'A ' + this.color + ' ' + this.desc + '.';
}
};
var newCar = new Car2();
var car2 = Object.create(newCar, {
//value properties
color: { writable: true, configurable:true, value: 'red' },
//concrete desc value
rawDesc: { writable: true, configurable:true, value: 'Porsche boxter' },
// data properties (assigned using getters and setters)
desc: {
configurable:true,
get: function () { return this.rawDesc.toUpperCase(); },
set: function (value) { this.rawDesc = value.toLowerCase(); }
}
});
car2.color = 'blue';
console.log(car2.getInfo());
car2.desc = "XXXXXXXX";
console.log(car2.getInfo());
console.log(car2.name);
</script>
</body>
</html>
結果為：
100
yupeng
yupeng1
201
I am returning: YUPENG
A blue PORSCHE BOXTER.
A blue XXXXXXXX.
aaaaaa
以上就是針對javascript一種新的對象創(chuàng)建方式Object.create()的詳細介紹，希望對大家的學習有所幫助。
相關文章
這篇文章主要為大家詳細介紹了javascript實現(xiàn)秒表計時器的制作方法，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-02-02
這篇文章以示例的方式為大家介紹下javascript 如何處理null及'null'值,需要的朋友可以參考下2014-06-06
createTextRange()的使用示例含文本框選中部分文字內容
這篇文章主要介紹了createTextRange()的使用示例,需要的朋友可以參考下2014-02-02
JavaScript是解釋型語言是毋庸置疑的，但它是不是僅在運行時自上往下一句一句地解析的呢？2009-10-10
下面小編就為大家?guī)硪黄猨query div模態(tài)窗口的簡單實例。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-05-05
基于JavaScript實現(xiàn)動態(tài)創(chuàng)建表格和增加表格行數(shù)
這篇文章主要介紹了基于JavaScript實現(xiàn)動態(tài)創(chuàng)建表格和增加表格行數(shù)的相關資料,需要的朋友可以參考下2015-12-12
Elasticsearch工具cerebro的安裝與使用教程
這篇文章主要介紹了Elasticsearch工具cerebro的安裝與使用教程,本文給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值，需要的朋友可以參考下2021-03-03
js window.onload 加載多個函數(shù)的方法
平時做項目 經(jīng)常需要使用window.onload，但window.onload 不能同時加載多個函數(shù)。2009-11-11
JS向上取整、向下取整、四舍五入、取絕對值、取較大較小值及隨機數(shù)代碼示例
在Js中對數(shù)值進行操作的場景有,向上取整、向下取整、四舍五入、固定精度、固定長度、取整,這篇文章主要給大家介紹了關于JS向上取整、向下取整、四舍五入、取絕對值、取較大較小值及隨機數(shù)的相關資料,需要的朋友可以參考下2024-04-04
一些很實用且必用的小腳本代碼...2006-08-08