二、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

使用 Object.create实现js 继承的更多相关文章

  1. [Javascript] Prototype 2 Object.create()

    function Fencepost (x, y, postNum){ this.x = x; this.y = y; this.postNum = postNum; this.connections ...

  2. Object.create用法

    用法: Object.create(object, [,propertiesObject]) 创建一个新对象,继承object的属性,可添加propertiesObject添加属性,并对属性作出详细解 ...

  3. js继承之Object.create()

    通过 Object.create() 方法,使用一个指定的原型对象和一个额外的属性对象创建一个新对象.这是一个用于对象创建.继承和重用的强大的新接口.说直白点,就是一个新的对象可以继承一个对象的属性, ...

  4. js 继承,Object.setPrototypeOf | Object.getPrototypeOf | Object.create class

    https://juejin.im/post/5cfd9d30f265da1b94213d28#heading-14 https://juejin.im/post/5d124a12f265da1b91 ...

  5. [JS] Topic - Object.create vs new

    故事背景 Ref: 你不知道的javascript之Object.create 和new区别 var Base = function () {} (1) var o1 = new Base(); (2 ...

  6. js Object.create 初探

    1.作用 Object.create()方法创建一个新对象,使用现有的对象来提供新创建的对象的__proto__. https://developer.mozilla.org/zh-CN/docs/W ...

  7. js中的new操作符与Object.create()的作用与区别

    js中的new操作符与Object.create()的作用与区别 https://blog.csdn.net/mht1829/article/details/76785231 2017年08月06日 ...

  8. 使用Object.create 克隆对象以及实现单继承

    var Plane = function () { this.blood = 100; this.attack = 1; this.defense = 1; }; var plane = new Pl ...

  9. 【前端】js中new和Object.create()的区别

    js中new和Object.create()的区别 var Parent = function (id) { this.id = id this.classname = 'Parent' } Pare ...

随机推荐

  1. Lazy Stored Properties--无括号时为匿名函数

    第一次使用的时候进行计算和初始化,后面的引用不在进行计算. A lazy stored property is a property whose initial value is not calcul ...

  2. 企业级任务调度框架Quartz(1) --企业应用中的任务调度介绍

    由于目前的工作内容为建行CLPM批处理业务的设计工作,所以很好的理解批处理所用的任务调度框架Quartz势在必行:为了能够更好的去服务于工作,也 为了提升自己,所以我学习了Quartz Job Sch ...

  3. Linux的mysql搭建

    1.centos7默认安装mariadb数据库 #yum  remove mariadb* 2.wget mysql数据库地址  如果是普通用户,请提权  sudo提权 3.yum local ins ...

  4. Mysql5.7安装过程----win10

    ---恢复内容开始--- 1.Mysql官网:https://www.mysql.com/downloads/ 有两种下载方式:msi和zip压缩包 2.我下载的是zip压缩包,选择mysql com ...

  5. 02022_System类的方法练习

    1.验证for循环打印数字1-9999所需要使用的时间(毫秒) public class Test { public static void main(String[] args) { long st ...

  6. asp.net mvc--传值-前台->后台

    前端传值->后端 一.Model Binding 方式 前台 @model ADMgr.Web.Models.ListModel 后台 [HttpPost] public ActionResul ...

  7. iOS动画之美丽的时钟

    1.终于效果图 2.实现思路 在ios中默认是绕着中心点旋转的,由于锚点默认在图层的中点,要想绕着下边中心点转,须要改变图层锚点的位置. 依据锚点.设置position坐标.为时钟的中点. 思考秒针旋 ...

  8. iOS 打印出视图中全部的子视图的名称

    使用递归: - (void)listSubviewsOfView:(UIView *)view { // Get the subviews of the view NSArray *subviews ...

  9. Codeforces Round #257(Div. 2) B. Jzzhu and Sequences(矩阵高速幂)

    题目链接:http://codeforces.com/problemset/problem/450/B B. Jzzhu and Sequences time limit per test 1 sec ...

  10. clipper库使用的一些心得

    clipper sourceforge官网:http://sourceforge.net/projects/polyclipping/ 1. 版本号差异 之前project里面使用4.8.6,近期升级 ...