Object.create方法及其在继承上的应用
来源:互联网 发布:mac的qq群相册 编辑:程序博客网 时间:2024/06/06 00:55
方法介绍
Object.create 方法是JavaScript中用于创建对象的一个方法 。
Object.create接收两个参数,第一个表示要继承的对象,第二个参数表示也是一个对象,用于对新创建的对象进行初始化 。下面我们来看具体应用:
var Obj ={ name:'mini', age:3, show:function () { console.log(this.name +" is " +this.age); }}
上面的Obj对象是一个原始对象,用于被继承 。
var MyObj = Object.create(Obj,{like:{ value:"fish", // 初始化赋值 writable:true, // 是否是可改写的 configurable:true, // 是否能够删除,是否能够被修改 enumerable:true //是否可以用for in 进行枚举},hate:{configurable:true,get:function () { console.log(111); return "mouse" }, // 获取对象hate属性时触发的方法set:function (value) { // 设置对象hate属性时触发的方法 console.log(value,2222); return value;} }});
注意:Object.create方法第二个参数的属性也是对象,对象中的所有属性都是固定,不是自定义的 。具体每个属性代表什么意思,我们在上边代码的注释中已有所标记。我们可以通过以下代码加深对这个方法的理解:
console.log(MyObj.name); // miniconsole.log(MyObj.like); // fishMyObj.like = "peanut"; // 属性修改赋值console.log(MyObj.like); // peanutMyObj.hate; // 111 触发get方法MyObj.hate = 'dog'; // dog,2222 触发set方法
相信通过上边的执行结果你已经能大概理解了Object.create方法的使用方法 。而且你可能也注意到了,这里get和set 方法似乎还蕴含更大的潜力 。我们可以利用它们去实现数据的过滤和数据的绑定 。实现一些简单的mvvm的效果。但这不是我们讨论的重点 。
在继承上的应用
在讲解Object.create方法在构造函数上的应用之前我们先来回顾构造函数的继承
var Animal=function () {}Animal.prototype.show=function () { console.log("animal");}var Dog = function () { }var subClass = function () {}subClass.prototype = Animal.prototype;Dog.prototype = new subClass(); // 继承Animal
以上代码是我们实现继承最常用的一种方式,这种方式是借助于一个代理函数,通过继承构造函数的实例来继承构造函数上的属性 。
在了解了Object.create方法之后,或许你可以通过另一种方式实现继承:
var A = function () { };A.prototype.sayName=function () { console.log('a');}// B的实例继承了A的属性var B = function () { };B.prototype = Object.create(A.prototype);var b = new B();b.sayName(); // a
通过检测,我们发现通过继承原型对象然后赋值给自己的原型对象的这种方式也可以实现继承 。但这种方式是不是我们想要的完美继承呢 ?
// 重新改写B的prototypeB.prototype= { sayName:function () { console.log("b"); }}// 改写后,B的实例属性发生了变化var b1 = new B();b1.sayName(); //b// A的实例维持原来的属性,没有被改写。达到了我们想要的继承效果var a1 = new A();a1.sayName(); //a
通过上边的案例,我们可以发现,Object.create这种方式实现了将A,B的原型完美分隔 。双方不会互相影响,也就是说这是确实可行的继承实现方式 。
不过,像Object.create这种黑科技方法一般都会存在兼容性问题 。所以我们还需要处理一下兼容问题,才能放心使用 。
if(typeof Object.create != "function") { Object.create=function (o) { function F() {} F.prototype=o; return new F(); } }
通过上边这个补丁代码,似乎又回到了我们之前处理继承的方式,如此一来,我们便可以在所有浏览器中 通过B.prototype =Object.create(A.prototype)的方式来实现继承了 。
- Object.create方法及其在继承上的应用
- 谈谈 Object.create ,JS的原型继承
- Object.create()方法的使用
- ADSI及其在WEB上的应用
- 偏振光及其在摄影上的应用
- JS原型链 new 与 Object.Create()区别 代码及继承的方法
- Object.create() 是什么?继承(继承特定的)
- 实现JavaScript的Object.create方法
- 原型式继承-Object.create()
- Object.create polyfill 方法
- LDA及其在人脸识别上的应用
- PCA算法及其在人脸识别上的应用
- CNN及其在lenet-5、Alexnet上的应用
- LASSO推导及其在恒星光谱上的应用
- 正则表达式及其在python上的应用
- Java学习第十七课(Object及其部分方法的应用)
- Object的几种方法及其作用
- Object类及其方法的介绍
- 基于 Redis 的分布式锁到底安全吗(上)?
- matlab学习
- Android 一个视图界面内某一View设置动画,其他视图view.setvisibility无效得解决方法
- myeclipse插件安装(一)-link文件安装
- Address already in use: JVM_Bind(端口冲突)
- Object.create方法及其在继承上的应用
- Elasticsearch 5.0新版本的特性与改进
- windows性能检测器参数项详解
- STM32系列选型指南
- 编程题汇总2
- C++初级学习(一)——基本语法与数据结构
- 基于 Redis 的分布式锁到底安全吗(下)?
- Android大图片加载 ARGB_4444 ARGB_8888 RGB565
- 欢迎使用CSDN-markdown编辑器