美文网首页
js继承遇到的小问题

js继承遇到的小问题

作者: 动感超人丶 | 来源:发表于2017-09-12 10:47 被阅读37次

这两天在看js继承方面,它不像OC那种传统的类继承。js继承方式还是挺多的。比如:原型继承、原型冒充、复制继承

原型继承

原型继承有点绕,js似乎没有类的概念,构造对象都是用的函数调用来实例化一个对象。函数都有一个prototype属性,如果要继承可以用函数的prototype属性来赋值父类的一个实例,这样就拥有父类的属性和方法

<script>
     function Cat ()  {
            this.climb = function () {
            alert("爬树");
        }
    }
     function Tiger()  {
            this.eat = function () {
            alert("吃肉");
        }
    }
    function Animal() {
            this.breath = function () {
                alert("呼吸");
            }
    }
    Tiger.prototype = new Cat();
    var tiger = new Tiger();
    tiger.eat();
    tiger.climb();

     console.log(tiger.__proto__);
     console.log(tiger.__proto__.__proto__);
     console.log(tiger.__proto__.__proto__.__proto__);
     console.log(tiger.__proto__.__proto__.__proto__.__proto__);

     var ani = new Animal();
    console.log(ani.__proto__);

    Tiger.prototype = ani;

    tiger = new Tiger();
    tiger.breath();
     tiger.eat();

     function All() {
         this.say = function () {
             alert("say");

         }
     }

    Animal.prototype = new All();
        ani = new Animal();
        ani.say();

</script>

原型冒充

注意call的用法

<script>

    function Good() {
        this.goodStudy = function () {
            console.log("好好学习");
            console.log(this);
        }
    }
    function Bad() {

    Good.call(this);
        this.badPlay = function () {
            console.log("就会玩");
        }
    }
    var bad = new Bad();
    bad.badPlay();
    bad.goodStudy();

</script>

复制继承

<script>

    function Good() {
        this.iq = 120;
        this.goodStudy = function () {
            console.log("好好学习");
        }
    }

    function Bad(obj) {
        this.badPlay = function () {
            console.log("就会玩");
        }
        this.extend = function (obj) {
            for (var k in obj){
                this[k] = obj[k];
            }
        }
    }

    var good = new Good();
    var bad = new Bad();
    bad.extend(good);

    bad.goodStudy();
    console.log(bad.iq);

</script>

这里面遇到一个问题,在循环遍历extend函数的时候,访问对象属性用的“[ ]”,如果用“.”会报错,其实js对象属性有两种访问形式:“.”和“[ ]",两个有区别,性能方面“.”更高一些。
Obj.key 和 Obj[key] 我的通俗理解: 1、当对象的属性key不确定而是一个变量的时候必须使用[] 2、[]里可以是任意字符串,而. 不能随便 3、使用. 号key可不加引号, 使用[] key有时候需要加引号。

嗯,就写到这里

相关文章

  • js继承遇到的小问题

    这两天在看js继承方面,它不像OC那种传统的类继承。js继承方式还是挺多的。比如:原型继承、原型冒充、复制继承 原...

  • C/C++32位与64位数据类型占用的字节数

    C++继承、虚继承、虚函数类的大小问题

  • Js的继承

    js的继承 @(js)[继承, js, 前端] 组合继承是原性链继承和构造函数继承的合体,它汲取了二者各自的有点,...

  • JS继承

    JS中的继承 许多OO语言都支持两种继承方式:接口继承和实现继承; 因为JS中没有类和接口的概念 , 所以JS不支...

  • #js继承

    js继承的概念 js里常用的如下两种继承方式: 原型链继承(对象间的继承)类式继承(构造函数间的继承) 类式继承是...

  • Moment.js 转换 UTC 格式的 2 个小问题

    在使用 Moment.js 转换为 UTC 格式的时候,我们可能会遇到 2 个小问题。 如果你使用 ('2021-...

  • JS中继承的实现

    JS中继承的实现 #prototype (js原型(prototype)实现继承) 全局的Function对象没有...

  • JavaScript 10

    js继承的概念 1.通过原型链方式实现继承(对象间的继承) 2.类式继承(构造函数间的继承) 由于js不像Java...

  • js继承

    js继承js 继承-简书 原型链实现集继承 上面的代码实现原型链继承最重要的son.prototype=new f...

  • JS继承的实现的几种方式

    前言 JS作为面向对象的弱类型语言,继承也是非常强大的特性之一,那么如何在JS实现继承呢? JS继承的实现方式 既...

网友评论

      本文标题:js继承遇到的小问题

      本文链接:https://www.haomeiwen.com/subject/rztcsxtx.html