ECMAScript新特性【一】--Object.create
Object.create(prototype, descriptors) :创建一个具有指定原型且可选择性地包含指定属性的对象
参数:
prototype 必需。 要用作原型的对象。 可以为 null。
descriptors 可选。 包含一个或多个属性描述符的 JavaScript 对象。
“数据属性”是可获取且可设置值的属性。 数据属性描述符包含 value 特性,以及 writable、enumerable 和 configurable 特性。
如果未指定最后三个特性,则它们默认为 false。 只要检索或设置该值,“访问器属性”就会调用用户提供的函数。 访问器属性描述符包含 set 特性和/或 get 特性。

var pt = {
say : function(){
console.log('saying!');
}
}
var o = Object.create(pt);
console.log('say' in o); // true
console.log(o.hasOwnProperty('say')); // false

如果prototype传入的是null,创建一个没有原型链的空对象。
var o1 = Object.create(null);
console.dir(o1); // object[ No Properties ]
当然,可以创建没有原型链的但带descriptors的对象;

var o2 = Object.create(null, {
size: {
value: "large",
enumerable: true
},
shape: {
value: "round",
enumerable: true
}
});
console.log(o2.size); // large
console.log(o2.shape); // round
console.log(Object.getPrototypeOf(o2)); // null

也可以创建带属性带原型链的对象:

var pt = {
say : function(){
console.log('saying!');
}
}
var o3 = Object.create(pt, {
size: {
value: "large",
enumerable: true
},
shape: {
value: "round",
enumerable: true
}
});
console.log(o3.size); // large
console.log(o3.shape); // round
console.log(Object.getPrototypeOf(o3)); // {say:...}

最重要的是实现继承,看下面实例:

//Shape - superclass
function Shape() {
this.x = 0;
this.y = 0;
} Shape.prototype.move = function(x, y) {
this.x += x;
this.y += y;
console.info("Shape moved.");
}; // Rectangle - subclass
function Rectangle() {
Shape.call(this); //call super constructor.
} Rectangle.prototype = Object.create(Shape.prototype); var rect = new Rectangle(); console.log(rect instanceof Rectangle); //true.
console.log(rect instanceof Shape); //true. rect.move(); //"Shape moved."

不支持浏览器的兼容实现:
1、简单实现,也是最常见的实现方式,没有实现第二个参数的功能:

if (!Object.create) {
Object.create = function (o) {
if (arguments.length > 1) {
throw new Error('Object.create implementation only accepts the first parameter.');
}
function F() {}
F.prototype = o;
return new F();
};
}

2、复杂实现,实现第二个参数的大部分功能:

if (!Object.create) {
// Contributed by Brandon Benvie, October, 2012
var createEmpty;
var supportsProto = Object.prototype.__proto__ === null;
if (supportsProto || typeof document == 'undefined') {
createEmpty = function () {
return { "__proto__": null };
};
} else {
createEmpty = function () {
var iframe = document.createElement('iframe');
var parent = document.body || document.documentElement;
iframe.style.display = 'none';
parent.appendChild(iframe);
iframe.src = 'javascript:';
var empty = iframe.contentWindow.Object.prototype;
parent.removeChild(iframe);
iframe = null;
delete empty.constructor;
delete empty.hasOwnProperty;
delete empty.propertyIsEnumerable;
delete empty.isPrototypeOf;
delete empty.toLocaleString;
delete empty.toString;
delete empty.valueOf;
empty.__proto__ = null;
function Empty() {}
Empty.prototype = empty;
// short-circuit future calls
createEmpty = function () {
return new Empty();
};
return new Empty();
};
}
Object.create = function create(prototype, properties) {
var object;
function Type() {} // An empty constructor.
if (prototype === null) {
object = createEmpty();
} else {
if (typeof prototype !== "object" && typeof prototype !== "function") {
throw new TypeError("Object prototype may only be an Object or null"); // same msg as Chrome
}
Type.prototype = prototype;
object = new Type();
object.__proto__ = prototype;
}
if (properties !== void 0) {
Object.defineProperties(object, properties);
}
return object;
};
}

参考:
https://developer.mozilla.org/zh-CN/docs/JavaScript/Reference/Global_Objects/Object/create
https://developer.mozilla.org/zh-CN/docs/JavaScript/Reference/Global_Objects/Object/defineProperty
https://developer.mozilla.org/zh-CN/docs/JavaScript/Reference/Global_Objects/Object/defineProperties
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/create
https://github.com/kriskowal/es5-shim/blob/master/es5-sham.js
ECMAScript新特性【一】--Object.create的更多相关文章
- 前端开发者进阶之ECMAScript新特性--Object.create
前端开发者进阶之ECMAScript新特性[一]--Object.create Object.create(prototype, descriptors) :创建一个具有指定原型且可选择性地包含指 ...
- 前端开发者进阶之ECMAScript新特性【一】--Object.create
Object.create(prototype, descriptors) :创建一个具有指定原型且可选择性地包含指定属性的对象 参数:prototype 必需. 要用作原型的对象. 可以为 nul ...
- ECMAScript5新特性之Object.isExtensible、Object.preventExtensions
阻止对象扩展后: 1 不能添加属性. 2 可以修改属性的值. 3 可以删除属性. 4 可以修改属性描述符. var fruit = { name : '苹果', desc : '红富士' }; // ...
- firefox-Developer开发者站点——关于Object.create()新方法的介绍
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/create Objec ...
- Object.create() __https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/create
Object.create() 方法会使用指定的原型对象及其属性去创建一个新的对象. 语法 Object.create(proto[, propertiesObject]) 参数 proto 新创建对 ...
- 使用 Object.create 创建对象,super 关键字,class 关键字
ECMAScript 5 中引入了一个新方法:Object.create().可以调用这个方法来创建一个新对象.新对象的原型就是调用 create 方法时传入的第一个参数: var a = {a: 1 ...
- ES6、7、8常用新特性总结(超实用)
ES6常用新特性 1. let && const let 命令也用于变量声明,但是作用域为局部 { let a = 10; var b = 1; } 在函数外部可以获取到b,获取不到a ...
- ECMAScript 5和ECMAScript6的新特性以及浏览器支持情况
ECMAScript简介: 它是一种由Ecma国际(前身为欧洲计算机制造商协会)制定和发布的脚本语言规范,javascript在它基础上经行了自己的封装.但通常来说,术语ECMAScript和java ...
- ECMAScript 2017(ES8)新特性简介
目录 简介 Async函数 共享内存和原子操作 Object的新方法 String的新方法 逗号可以添加到函数的参数列表后面了 简介 ES8是ECMA协会在2017年6月发行的一个版本,因为是ECMA ...
随机推荐
- MP3 Music Library in Tornado
Web2.0的lab3,使用tornado实现,自己改了改UI 效果 选中播放列表后的效果 原来的图标长得太丑了,有空找些好看点的加进去……以后继续完成extra feature,当复习python了 ...
- 保存最后N个元素
cookbook系列 问题:对要搜索的值的最后几项做个有限的历史记录. 方案: #coding=utf- from collections import deque def search(lines, ...
- Cordova - 禁用整个应用页面的上下拖动效果(防止拖动出现黑边)
可在 config.xml 中进行如下设置: <preference name="WebViewBounce" value="false" /> ...
- Underscore.js-精巧而强大实用功能库
前言 从其他语言转向Javascript时,通常都会遇到一些困惑性问题.比如,Java中的HashMap在Javascript中如何实现?Javascript面向对象式编程如何实现继承?如何实现通用的 ...
- python 类继承
#!/usr/bin/python # Filename: inherit.py class SchoolMember: '''Represents any school member.''' def ...
- Python之路【第六篇】:模块与包
目录 一 模块 3.1 import 3.2 from ... import... 3.3 把模块当做脚本执行 3.4 模块搜索路径 3.5 编译python文件 3.6 标准模块 3.7 dir ...
- Selenium快速入门(上)
浏览器驱动下载 Edge浏览器 Firefox浏览器 Safari浏览器 Chrome浏览器 PhantomJS浏览器 下载完成之后,添加到环境变量. 声明浏览器对象 selenium支持的浏览器版本 ...
- 表白 代码 韩梦飞沙-画心.html
韩梦飞沙 韩亚飞 313134555@qq.com yue31313 han_meng_fei_sha 韩梦飞沙-画心.html <!DOCTYPE html> <html& ...
- CUDA学习笔记2:CUDA(英伟达显卡统一计算架构)与已有的VS项目结合
一.步骤 1.先新建一个简单的控制台应用程序,项目名称为Mytest,如下图所示: 2.在项目中添加一个名为Test.cu文件,如下图所示: 3.在解决方案资源管理器中选择该项目并点击右键,在弹出的菜 ...
- BZOJ4552 HEOI2016排序
太棒了!思路很不错. 没想到HEOID1三道线段树. 这题我们可以二分答案,将小于他的在线段树中设成0,大于他的设成1然后模拟操作复杂度O(mlog^2n) By:大奕哥 #include<bi ...