一种新的javascript对象创建方式Object.create()

Object.create() 是什么?
Object.create(proto [, propertiesObject ]) 是E5中提出的一种新的对象创建方式,第一个参数是要继承的原型,如果不是一个子函数,可以传一个null,第二个参数是对象的属性描述符,这个参数是可选的。
例如: 

function Car (desc) {
  this.desc = desc;
  this.color = "red";
}

Car.prototype = {
  getInfo: function() {
   return 'A ' + this.color + ' ' + this.desc + '.';
  }
};
//instantiate object using the constructor function
var car = Object.create(Car.prototype);
car.color = "blue";
alert(car.getInfo());

结果为:A blue undefined.

1、propertiesObject 参数的详细解释:(默认都为false)
数据属性:

  • writable:是否可任意写
  • configurable:是否能够删除,是否能够被修改
  • enumerable:是否能用 for in 枚举
  • value:值

访问属性:

  • get(): 访问
  • set(): 设置

2、例子:直接看例子就知道怎么用。 

<!DOCTYPE html>
<html>
<head>
  <title>yupeng's document </title>
  <meta charset="utf-8"/>
</head>
<body>
  <script type="text/javascript">

    var obj = {

      a:function(){
        console.log(100)
      },
      b:function(){
        console.log(200)
      },
      c:function(){
        console.log(300)
      }

    }

    var newObj = {};

    newObj = Object.create(obj,{
      t1:{
        value:'yupeng',
        writable:true
      },
      bar: {
        configurable: false,
        get: function() { return bar; },
        set: function(value) { bar=value }
      }

    })

    console.log(newObj.a());
    console.log(newObj.t1);
    newObj.t1='yupeng1'
    console.log(newObj.t1);
    newObj.bar=201;
    console.log(newObj.bar)

    function Parent() { }
    var parent = new Parent();
    var child = Object.create(parent, {
       dataDescriptor: {
        value: "This property uses this string as its value.",
        writable: true,
        enumerable: true
       },
       accessorDescriptor: {
        get: function () { return "I am returning: " + accessorDescriptor; },
        set: function (val) { accessorDescriptor = val; },
        configurable: true
       }
      });

    child.accessorDescriptor = 'YUPENG';
    console.log(child.accessorDescriptor);

    var Car2 = function(){
      this.name = 'aaaaaa'
    } //this is an empty object, like {}
    Car2.prototype = {
     getInfo: function() {
      return 'A ' + this.color + ' ' + this.desc + '.';
     }
    };

    var newCar = new Car2();

    var car2 = Object.create(newCar, {
     //value properties
     color:  { writable: true, configurable:true, value: 'red' },
     //concrete desc value
     rawDesc: { writable: true, configurable:true, value: 'Porsche boxter' },
     // data properties (assigned using getters and setters)
     desc: {
      configurable:true,
      get: function ()   { return this.rawDesc.toUpperCase(); },
      set: function (value) { this.rawDesc = value.toLowerCase(); }
     }
    });
    car2.color = 'blue';
    console.log(car2.getInfo());
    car2.desc = "XXXXXXXX";
    console.log(car2.getInfo());
    console.log(car2.name);

  </script>
</body>
</html>

结果为:
100
yupeng
yupeng1
201
I am returning: YUPENG
A blue PORSCHE BOXTER.
A blue XXXXXXXX.
aaaaaa

以上就是针对javascript一种新的对象创建方式Object.create()的详细介绍,希望对大家的学习有所帮助。

(0)

相关推荐

  • JavaScript创建对象的方式小结(4种方式)

    本文实例总结了JavaScript创建对象的方式.分享给大家供大家参考,具体如下: 潜意识里,JavaScript不能算是面向对象的语言,要算也只能说是趋向面向对象的一种语言,至少它不能很好的吻合面向对象最基本的三大特性(继承.封装.多态),当然有很多人就认为JavaScript是面向对象语言,好像也说得没错,因为面向对象也能在JavaScript中实现,比如说继承.封装吧也都可以在JavaScript中实现,但是实现方便吗?所以我觉得很疑惑.看到网上有一网友评价的很好,"面向对象只是一种思想,

  • 详解JavaScript基于面向对象之创建对象(2)

    接着上文<详解JavaScript基于面向对象之创建对象(1)>继续学习. 4.原型方式        我们创建的每个函数都有一个通过prototype(原型)属性,这个属性是一个对象,它的用途是包含可以由特定类型的所有实例共享的属性和方法.逻辑上可以这么理解:prototypt通过条用构造函数而创建的那个对象的原型对象.使用原型的好处就是可以让所有对象实例共享它所包含的属性和方法.也就是说,不必在构造函数中定义对象信息,而是直接将这些信息添加到原型中.        原型方式利用了对象的pr

  • JavaScript中对象的不同创建方法

    javascript中的对象与一般的面向对象的程序设计语言(c++,Java等)不同,甚至很少有人说它是面向对象的程序设计语言,因为它没有类.javaScript只有对象,不是类的实例.javascript中的对象是基于原型的. 1.1句点运算符创建 javascript中的对象实际上就是一个由属性组成的关联数组,属性由名称和值组成,值的类型可以是任何数据类型,或者函数和其他对象. 创建一个简单对象: var foo = {}; foo.prop_1 = 'bar'; foo.prop_2 =

  • javascript创建对象、对象继承的实用方式详解

    本文约定:不特殊声明的情况下,属性代指属性或方法. 创建对象.对象继承实际上是一回事:我们所需要的实例对象通过构造函数获得私有属性.通过原型链获得共享的属性.什么是好的方式?私有属性通过构造函数的方式获得(不考虑实例中自定义私有属性)且不需要重写,共享属性通过原型链找到且不需要重复创建. 普适的方式 组合使用构造函数模式和原型模式创建对象 function HNU_student(name) { this.name = name; this.sayName = function() { retu

  • javascript对象的创建和访问

    JavaScript,很少能让人想到它面向对象的特性,甚至有人说它不是面向对象的语言,因为它没有类.没错, JavaScript 真的没有类,但 JavaScript 是面向对象的语言. JavaScript 只有对象,对象就是对象,不是类的实例. 因为绝大多数面向对象语言中的对象都是基于类的,所以经常有人混淆类的实例与对象的概念.对象就是类的实例,这在大多数语言中都没错,但在 JavaScript 中却不适用.JavaScript 中的对象是基于原型的. 创建和访问 JavaScript 中的

  • 学习javascript面向对象 掌握创建对象的9种方式

    本文为大家分享了javascript创建对象的9种方式,供大家参考,具体内容如下 [1]使用Object构造函数 [缺点]使用同一个接口创建很多对象,会产生大量重复代码 var person = new Object(); person.name = "Nicholas"; person.age = 29; person.job = "Software Engineer"; person.sayName = function(){ alert(this.name);

  • js创建对象的方法汇总

    js一个有三种方法创建对象,这里做一个总结. 1.对象直接量 所谓对象直接量,可以看做是一副映射表,这个方法也是最直接的一个方法,个人比较建议, //创建简单对象 var obj1 = {}; //空对象 var obj2 = { name: "ys", age: 12 }; //创建复杂对象 var obj3 = { name: "ys", age: 12, like: { drink: "water", eat: "food&quo

  • JS中多种方式创建对象详解

    1.内置对象创建 var girl=new Object(); girl.name='hxl'; console.log(typeof girl); 2.工厂模式,寄生构造函数模式 function Person(name){ var p=new Object();//内部进行实例化 p.name=name; p.say=function(){ console.log('my name is '+ p.name); } return p;//注:一定要返回 } var girl=Person('

  • JS创建对象几种不同方法详解

    本文介绍了几种js创建对象的方法,分享给大家供大家参考,具体内容如下 1.工厂模式 弊端:没有解决对象的识别问题,即怎么知道一个对象的类型. 2.构造函数模式 与工厂模式相比: 1.没有显式的创建对象 2.直接将属性和方法赋给了this对象 3.没有return语句 要创建person的实例,必须使用new操作符,以这种方式调用构造函数实际上会经历4个步骤: 1.创建一个新对象 2.将构造函数的作用域赋给新对象 3.执行构造函数中的代码 4.返回新对象 创建自定义的构造函数可以将它的实例标识为一

  • 一种新的javascript对象创建方式Object.create()

    Object.create() 是什么? Object.create(proto [, propertiesObject ]) 是E5中提出的一种新的对象创建方式,第一个参数是要继承的原型,如果不是一个子函数,可以传一个null,第二个参数是对象的属性描述符,这个参数是可选的. 例如: function Car (desc) { this.desc = desc; this.color = "red"; } Car.prototype = { getInfo: function() {

  • JavaScript 对象创建的3种方法

    目录 1.对象字面量 2.new 关键字创建对象 3.使用 Object.create() 创建对象 4. 使用扩展操作符:... 5.使用Object.assign()方法 6.简写属性 7.简写方法 前言: 在 JavaScript中,对象是一组有属性名和属性值组成的无序集合,对象的创建可以通过对象字面量.new 关键字 和Object.create()函数来创建. 1.对象字面量 let obj = {} // 空对象 let obj2 = {a:1, b:2} let obj3 = {"

  • 详解 javascript对象创建模式

    创建模式 在javascript中,主要有以下几种创建模式: 工厂模式 构造函数模式 原型模式 组合模式 动态原型模式 寄生构造函数模式 稳妥构造模式 工厂模式 工厂模式是软件工程领域一种广为人知的设计模式.javascript实现方式: function createPerson(name, obj, job) { var o = new Object(); o.name = name; o.obj = obj; o.job = job; o.sayName = function() { al

  • JavaScript对象创建模式实例汇总

    本文实例总结了JavaScript对象创建模式.分享给大家供大家参考,具体如下: 在JavaScript中创建对象是很容易的,可以使用对象字面量或者构造函数.常用的创建对象的模式有以下几种: 一. 工厂模式 工厂模式抽象了具体对象的过程,用函数来封装以特ing接口创建对象的细节. 如下: function createAnimal(name, age) { var o = new Object(); o.name = name; o.age = age; o.sayName = function

  • JavaScript对象拷贝与Object.assign用法实例分析

    本文实例讲述了JavaScript对象拷贝与Object.assign用法.分享给大家供大家参考,具体如下: 深拷贝与浅拷贝 在 JavaScript 中,对于基本数据类型(undefined.null.boolean.number.string)来说,在变量中存储的就是这个变量本身的值,复制是对值的复制,不存在深浅之说.但C系语言的共同特点中有,存储引用类型(对象),实际中在变量里存的是它的地址.因此对 JavaScript 中的复杂数据类型(object)来说,也会有浅拷贝和深拷贝的概念:浅

  • JavaScript对象创建及继承原理实例解剖

    对象创建: 当一个函数对象被创建时候,Function构造器产生的函数对象会运行类似这样的代码: 复制代码 代码如下: this.prototype={constructor:this}; 假设函数F F用new方式构造对象时,对象的constructor被设置成这个F.prototype.constructor 如果函数在创建对象前修改了函数的prototype,会影响创建出来对象的construtor属性 如: 复制代码 代码如下: function F(){}; F.prototype={

  • JavaScript对象的四种创建方法

    目录 前言 1. 基于对象字面量 2. 利用new Object方式创建对象 3. 基于构造函数 4. 基于工厂方法 前言 今天我们来学习一下JavaScript中关于对象的四种创建方法. 首先,我们来确定一个对象的属性和方法.比如说,我们想要我们定义一个girlFriend的对象,希望她有名字name.年龄age的属性,希望有一个getName方法,来获取名字:最后属性是一个稍微复杂的对象属性address,它具有两个属性值,所在地name和邮政编码code. 接下来,我们来通过本篇内容,来看

  • JavaScript 对象详细整理总结

    Javascript 对象总结: JavaScript对象可以看作是属性的无序集合,每个属性就是一个键值对,可增可删. JavaScript中的所有事物都是对象:字符串.数字.数组.日期,等等. JavaScript对象除了可以保持自有的属性外,还可以从一个称为原型的对象继承属性.对象的方法通常是继承的属性.这种"原型式集成"是JavaScript的的核心特征. 1.创建对象 第一种:对象直接量表示法创建对象. 这是最简单的对象创建方式,对象直接量由若干key:value键值对属性组成

  • 全面了解JavaScript对象进阶

    要了解JavaScript对象,我们可以从对象创建.属性操作.对象方法这几个方面入手.概括起来,包括以下几模块: 1.创建对象 1.1 对象直接量 对象直接量是创建对象最简单的方式,由若干名/值对组成映射表: var point = {x: 0, y: 0 }; 属性名也没有什么限制,可以是js的关键字或者任意字符串,如果是这两种情况,属性需要用双引号引起来: var empty = {}; va point = {x: 0, y: 0 }; var book = { "main title&q

  • JavaScript中创建原子的方法总结

    前言 原子操作这是Java多线程编程的老生常谈了.所谓原子操作是指不会被线程调度机制打断的操作:这种操作一旦开始,就一直运行到结束,中间不会有任何 context switch (切换到另一个线程). 当然JS是单线程的,所以不存在线程打断这么一说,我只是从Java中借引了这么一个概念.如果一段JS代码在执行过程中没有未知操作被引入,那么这段代码就是100%可控和安全的,这就是原子操作.反之非原子操作可能会因为外界操作的引入导致代码变得难以控制而产生隐晦的bug. JavaScript中可以通过

随机推荐