zoukankan      html  css  js  c++  java
  • javascript 创建对象及对象原型链属性介绍

    我们知道javascript里定义一个普通对象的方法,如:

    let obj = {};
    obj.num = 1;
    obj.string = 'string';
    obj.func = function(){alert('func')};
    obj.arr = ['x','y'];
    console.log(obj.num);    //1
    console.log(obj.string);    // "string"
    console.log(obj.func);    //function(){alert('func')}
    console.log(obj.arr);    //["x", "y"]

    或是:

    let obj = {
          num: 1,
          string: 'string',
          func: function() {alert('func')},
          arr: ['x', 'y']
    }

    构造函数方式:

    function animal() {
        this.name = 'animal';
    }
    let obj = new animal();
    console.log(obj.name);    //"animal"

    等等。

    不过每个对象都有它所对应的原型属性,譬如我们给一个对象添加原型属性:

    function animal() {
        animal.prototype.name = 'animal';
        animal.prototype.x = 1;
    }
    let obj = new animal();
    obj.x = 10;
    console.log(obj.name);   //'animal'
    console.log(obj.x);   //10
    console.log(animal.prototype.x) //1

    上面我们给animal对象原型上添加了name和x属性,在下面 new 一个新的构造函数obj时,它本身是继承animal对象的,所以我们能找到obj里面的name属性值,不过obj一旦给animal已有属性 'x' 重新赋值为10的时候,这时候x的值就改变了,但是animal原型上的 'x' 值是没变的,原因是obj里的属性是优先找它自己里面有定义的属性,如果找不到,就会去它的原型链上找,也就是animal。

    我们再来看下案例:

    console.log(typeof obj.toString) // "function"
    console.log('name' in obj)    //true    ‘in`关键字也会找到它的原型链上去,所以name是存在的
    console.log(obj.hasOwnProperty('x'))   // true
    console.log(obj.hasOwnProperty('name'))    //false

    为什么obj对象和animal对象我们刚刚都没有定义toString方法,那这个toString方法是哪里来的?这也是一个优先级的问题,它会从obj开始一直向上查找,直到找到这个属性为止,如果没有将会返回undefined,而每个Object对象原型里里默认有toString方法的。hasOwnProperty()方法是用来判断一个对象是否有你给出名称的属性或对象,它使用来判断当前对象,而无法判断当前对象的原型链上的属性是否存在,因为obj没有定义name属性,所有返回false。

    再介绍另外一个继承对象原型链的方法:

    let cat = new Object({
        name: 'cat',
        y:100
    });
    
    let obj = Object.create(cat);
    obj.x = 1;
    console.log(obj.hasOwnProperty('x'))  //true
    console.log(obj.hasOwnProperty('y'))  //false
    console.log(obj.name)    //cat
    console.log(obj.y)    //100
  • 相关阅读:
    记录两种获取配置文件的方法
    jsp-自定义标签
    转载 -jsp静态包含和动态包含的区别
    Linux基础知识笔记
    关于HTTP协议
    关于orcale创建type的一些小经验(遇到的坑)
    servlet处理乱码之post和get
    发布restful类型的接口
    ros2 dashing 安装失败指南
    exit回调
  • 原文地址:https://www.cnblogs.com/evai/p/5868680.html
Copyright © 2011-2022 走看看