1.Object.create() 是什么?

  Object.create(proto [, propertiesObject ]) 是E5中提出的一种新的对象创建方式,第一个参数是要继承的原型,如果不是一个子函数,可以传一个null,第二个参数是对象的属性描述符,这个参数是可选的。

  例如: 

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.

2.propertiesObject 参数的详细解释:(默认都为false)

 数据属性

  • writable:是否可任意写
  • configurable:是否能够删除,是否能够被修改
  • enumerable:是否能用 for in 枚举
  • value:值

 访问属性:

  • get(): 访问
  • set(): 设置

3.例子:直接看例子就知道怎么用。 

<!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
 
参考文章:
1.http://www.htmlgoodies.com/beyond/javascript/object.create-the-new-way-to-create-objects-in-javascript.html
2.http://www.jimmycuadra.com/posts/ecmascript-5-object-creation-and-property-definition
3.http://msdn.microsoft.com/zh-cn/library/ie/ff925952(v=vs.94).aspx

javascript一种新的对象创建方式-Object.create()的更多相关文章

  1. 【20190220】JavaScript-知识点整理:对象创建方式、原型、闭包

    一.对象创建方式 1. 工厂模式 这种模式抽象了创建具体对象的过程,用函数来封装以特定接口创建对象的细节.存在的问题是无法通过 instanceof 识别一个对象的类型. function creat ...

  2. 第163天:js面向对象-对象创建方式总结

    面向对象-对象创建方式总结 1. 创建对象的方式,json方式 推荐使用的场合: 作为函数的参数,临时只用一次的场景.比如设置函数原型对象. var obj = {}; //对象有自己的 属性 和 行 ...

  3. 转: .NET MVC3 几种返回 JSON 对象的方式和注意事项

    .NET MVC3 几种返回 JSON 对象的方式和注意事项 转自:http://blog.csdn.net/xxj_jing/article/details/7382589 引言在用 .NET MV ...

  4. spring mvc中几种获取request对象的方式

    在使用spring进行web开发的时候,优势会用到request对象,用来获取访问ip.请求头信息等 这里收集几种获取request对象的方式 方法一:在controller里面的加参数 public ...

  5. WebKit JavaScript Binding添加新DOM对象的三种方式

    一.基础知识 首先WebKit IDL并非完全遵循Web IDL,只是借鉴使用.WebKit官网提供了一份说明(WebKitIDL),比如Web IDL称"operation”(操作), 而 ...

  6. javascript最常用的对象创建方式

    //第一种 function Demo(){ var obj=new Object(); obj.name="Yubaba"; obj.age=12; obj.firstF=fun ...

  7. .Net中各种不同的对象创建方式的速度差异

    在.Net中,微软给我们提供了很多不同的创建对象实例的方法,它们的速度又各有不同,以下一一列举. 使用new关键字 这在.Net中是最常见,也是速度最快的方式:                     ...

  8. Swift 对象创建(PUT Object)过程详解——基于副本策略(一)

    swift中创建对象,即PUT object,根据选定的存储策略将对象内容写入至相应的服务器(object server).我们重点关注object controller和object servers ...

  9. 前端开发者进阶之ECMAScript新特性【一】--Object.create

    Object.create(prototype, descriptors) :创建一个具有指定原型且可选择性地包含指定属性的对象 参数:prototype 必需.  要用作原型的对象. 可以为 nul ...

随机推荐

  1. Html/Css(新手入门第一篇)

    一.理解web标准含义--为什么采用web标准*****将内容与样式分离1.web标准是一系列标准,就是一系列技术标准在使用时,是组合应用[1].结构化内容 html[2].表现化内容 css[3]. ...

  2. canvas,制作炫酷的时钟和倒计时

    html部分 p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 30.0px Consolas; color: #2b7ec3 } p.p2 { margin ...

  3. JavaScript-indexOf函数

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  4. Java文件内容的复制

    package a.ab; import java.io.*; public class FileReadWrite { public static void main(String[] args) ...

  5. 【Win10】UAP/UWP/通用 开发之 SplitView

    [Some information relates to pre-released product which may be substantially modified before it's co ...

  6. CoreCLR on Mac:体验managed exception handling

    C#测试代码: using System; class Program { static void A() { try { Console.WriteLine("Throwing an ex ...

  7. Javascript中new Date的坑

    在一段判断是否过期的js代码中是这么写的: if (new Date() < new Date(2014, 9, 25)) { //... } 后来发现过了9月25日竟然不过期,console. ...

  8. [MSSQL] Useful SQL Scripts - CalendarBase

    Useful SQL scripts DECLARE @StartDate DATETIME DECLARE @EndDate DATETIME DECLARE @FiscalBeginMonth I ...

  9. Flash矢量图与位图性能对比

    Flash中使用位图的性能要高于矢量图,究竟有多大区别呢?数据有最好的说服力,开始测试: 一.机器配置 二.测试过程 测试程序控制红色小球在舞台中不停匀速移动,通过改变小球数量控制实际帧率在24帧/秒 ...

  10. [芯片] 4、接口技术·实验四·串行接口8251A

    目录 一.实验目的和要求... 2 二.实验原理与背景... 3 三.实验具体的内容... 3 四.实验的代码说明... 4 五.实验结果的分析... 6 附录资料 一.实验目的和要求 学会8251芯 ...