专栏首页前端儿JS 中对象的简单创建和继承

JS 中对象的简单创建和继承

对象的简单创建

1.通过对象直接量创建

比如 var obj = {};

2.通过new 创建

比如 var obj = new Object(); // 相当于var obj = {};

   var arr = new Array();

3.使用 Object.create()

这个方法有两个参数,第一个参数是这个对象的原型,第二个参数用以对对象的属性进行进一步描述(可选)

var obj = Object.create({x:1});
var obj1 = Object.create(null);
console.log(obj instanceof Object);//true
console.log(obj1 instanceof Object);//false

使用后obj将继承来自原型对象Object的属性,并具有obj.x = 1 的属性值 但当参数为null时,obj1则是一个没有原型的新对象,不会继承任何东西,甚至没有初始的toString()方法。

所以,如果仅仅是想创建一个空对象,有以下三种方式:

var obj = {};
var obj = new Object();
var obj = Object.create(Object.prototype);

对象的简单继承:

可以通过原型继承创建一个新对象

以下函数inherit() 返回一个继承自原型对象p的属性的新对象

function inherit(p){ 
    if(p == null){   // 不能从null中继承
        throw TypeError();
    }
    if(Object.create){   //如果有这个方法就直接使用
        return Object.create(p);
    }
    var t = typeof p;
    if(t !== "object" && t !== "function"){   //要继承的对象  类型要符合
        throw TypeError();
    }
    function f(){ };  //定义一个空的构造函数
    f.prototype = p;  //原型指向要继承的对象p
    return new f();   //创建f对象,此对象继承自p
}

var obj = {x:1};
var obj1 = inherit(obj);
console.log(obj1.x);  // 1

如上,obj1继承了来自obj对象定义的x属性

又如

function inherit(p){ 
    if(p == null){   // 不能从null中继承
        throw TypeError();
    }
    if(Object.create){   //如果有这个方法就直接使用
        return Object.create(p);
    }
    var t = typeof p;
    if(t !== "object" && t !== "function"){   //要继承的对象  类型要符合
        throw TypeError();
    }
    function f(){ };  //定义一个空的构造函数
    f.prototype = p;  //原型指向要继承的对象p
    return new f();   //创建f对象,此对象继承自p
}

var o = {}; //o 继承Object.prototype
o.x = 1;
var p = inherit(o); //p继承o和Object.prototype
p.y = 2;
var q = inherit(p); //q继承p和o和Object.prototype
q.z = 3;
console.log(q.x+q.y == q.z);//true

对象属性相关操作涉及到了原型链的规则 值得注意的是:它总是在原始对象上创建属性或对已有的属性赋值,而不会去修改原型链;在JS中,只有在查询属性时才会体会到继承的存在,而设置属性则和继承无关。

还是代码解释吧

var obj1 = {x:1};
var obj2 = inherit(obj1);
console.log(obj1.x);//1
console.log(obj2.x);//1
obj2.x = 2;
console.log(obj1.x);//1
console.log(obj2.x);//2

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • JS 对象属性相关--检查属性、枚举属性等

    delete只是断开属性和宿主对象的联系,而不会去操作属性中的属性  看到delete a.p之后b.x仍然为1

    书童小二
  • Tree

    Little Valentine liked playing with binary trees very much. Her favorite game wa...

    书童小二
  • 【转】http-equiv="X-UA-Compatible" 设置IE浏览器兼容模式详解

    文件兼容性用于定义让IE如何编译你的网页。此文件解释文件兼容性,如何指定你网站的文件兼容性模式以及如何判断一个网页该使用的文件模式。

    书童小二
  • Guava------------Cache使用方法

        简单从这几个方面描述一下如何使用Cache,对Cache的各种原理介绍此处不涉及.     1.使用场景     2.如何使用Cache     3.创...

    Gxjun
  • Identify the logic how BOL node name is categorized into different object type

    Identify the logic how BOL node name is categorized into different object type

    Jerry Wang
  • 享元模式

    享元(flyweight)模式是一种用于性能优化的模式,“fly”在这里是苍蝇的意思,意为蝇量级。享元模式的核心是运用共享技术来有效支持大量细粒度的对象。如果系...

    一粒小麦
  • SpringCloud服务发现注册Eureka +Ribbon + Feign

    假设有2个微服务A和B分别在端点http:// localhost:8181 /和http:// localhost:8282 /上运行,如果想要在A服务中调用...

    慕容千语
  • 卷积神经网络(CNN):从原理到实现

    1.前言 (1)神经网络的缺陷 在神经网络一文中简单介绍了其原理,可以发现不同层之间是全连接的,当神经网络的深度、节点数变大,会导致过拟合、参数过多等问题...

    MachineLP
  • 第24次文章:结构性模式(续)

    本周把结构性模式的剩余几种模式学完了,并且开始接触行为型模式。为便于对文章的分类,本周的文章就只把结构性模式全部扫尾处理。行为型模式放在下周的文章中一起介绍吧!

    鹏-程-万-里
  • Python列表推导式中使用if-else

    hankleo

扫码关注云+社区

领取腾讯云代金券