二、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. Ubuntu 16.04 安装python3.6 环境并设置为默认

    1.添加python3.6安装包,并且安装 sudo apt-get install software-properties-common 2.下载python3.6 sudo add-apt-rep ...

  2. 路飞学城Python-Day107

    88-Ajax简介 Ajax是前端的JS技术,目前向服务器发送请求是通过1.向浏览器的地址栏发送请求的方式:2.form表单的请求方式是两种get和post方式:3.a标签的href属性对接地址 是一 ...

  3. springboot 打包下载数据

    //文件打包下载     public static HttpServletResponse downLoadFiles(List<File> files,             Htt ...

  4. Python学习笔记(1)Pycharm基本认识

    Pycharm的使用 集成开发环境(IDE,集成开发环境) VIM  #经典的linux下的文本编辑器 Pycharm,主要用于python开发的ide PyCharm常用快捷键 Ctrl + / # ...

  5. 手机上怎么去掉a 标签中的img点击时的阴影?

    添加: <style type="text/css"> a { -webkit-tap-highlight-color: transparent; -webkit-to ...

  6. <constant name="struts.devMode" value="true" />

    <constant name="struts.devMode" value="true" /> 当vlaue为true,表示struts处于开发模式 ...

  7. BA-深化设计流程

    本文分三个层次描述了常规BA系统深化设计应包含了步骤和文件,第一个.第二个为转载别人的步骤,第三个为本人写的步骤. 深化系统大体步骤: 1.认真阅读招标文件,明确招标方需求. 2.仔细查阅图纸,确定被 ...

  8. 工具-putty使用

    Ubuntu 下安装 OpenSSH Server 是无比轻松的一件事情,需要的命令只有一条 sudo apt-get install openssh-server 启动SSH服务: sudo /et ...

  9. spring mvc流程理解

    1.controller处理的终究就是一个结果,默认是modelandview对象,controller里自己随便调用service或者dao,终究都还是在controller里有返回值. 2.  在 ...

  10. Fibbonacci Number(杭电2070)

    /*Fibbonacci Number Problem Description Your objective for this question is to develop a program whi ...