博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
使用 Object.create实现js 继承
阅读量:4935 次
发布时间:2019-06-11

本文共 1300 字,大约阅读时间需要 4 分钟。

 

二、Object.create实现继承

本文将来学习第七种继承方式Object.create()方法来实现继承,关于此方法的详细描述,请戳这里。下面来通过几个实例来学习该方法的使用:
 
 
var Parent = {
    getName: function() {
        return this.name;
    }
}
 
var child = Object.create(Parent, {
    name: { value: "Benjamin"},
    url : { value: "http://www.zuojj.com"}
});
 
//Outputs: Object {name: "Benjamin", url: "http://www.zuojj.com", getName: function}
console.log(child);
 
//Outputs: Benjamin
console.log(child.getName());
我们再来看一个例子,再添加一个继承:
 
 
var Parent = {
    getName: function() {
        return this.name;
    },
    getSex: function() {
        return this.sex;
    }
}
 
var Child = Object.create(Parent, {
    name: { value: "Benjamin"},
    url : { value: "http://www.zuojj.com"}
});
 
var SubChild = Object.create(Child, {
    name: {value: "zuojj"},
    sex : {value: "male"}
})
 
//Outputs: http://wwww.zuojj.com
console.log(SubChild.url);
 
//Outputs: zuojj
console.log(SubChild.getName());
 
//Outputs: undefined
console.log(Child.sex);
 
//Outputs: Benjamin
console.log(Child.getName());
通过上面可以看出Object.create()方法实现了链式继承,及原型链的继承。如果在控制台打印出各个生成的对象,可以很清楚的看到。
 
//Outputs: true
console.log(Child.isPrototypeOf(SubChild));
//Outputs: true
console.log(Parent.isPrototypeOf(Child));
isPrototypeOf() 方法测试一个对象是否存在于另一个对象的原型链上。 以上就是本文对Object.create方法的描述,文中不妥之处,还望批评指正。
 

//来自:http://www.2cto.com/kf/201411/349571.html

转载于:https://www.cnblogs.com/zhujiasheng/p/6220664.html

你可能感兴趣的文章
用jquery来实现类似“网易新闻”横向标题滑动的移动端页面
查看>>
(原)基于物品的协同过滤ItemCF的mapreduce实现
查看>>
CSS可以和不可以继承的属性
查看>>
eclipse每次当我按ctrl+鼠标点击代码,自动关闭,产生原因及解决办法!!
查看>>
hbase
查看>>
用PHP将Unicode 转化为UTF-8
查看>>
HDOJ1002 A+B Problem II
查看>>
ADB server didn't ACK(adb不能开启
查看>>
网页内容抓取
查看>>
分布式和集群的区别
查看>>
Python基础(三)
查看>>
Sql server在cmd下的使用
查看>>
【BZOJ 1019】 1019: [SHOI2008]汉诺塔 (DP?)
查看>>
swing
查看>>
Continuous integration
查看>>
前端知识点总结
查看>>
github 在ubuntu 使用--常用命令
查看>>
hl7 V2中Message Control ID的含义及应用
查看>>
IOS 4个容易混淆的属性(textAligment contentVerticalAlignment contentHorizontalAlignment contentMode)...
查看>>
iOS 修改textholder的颜色
查看>>