• JavaScript 继承


    JavaScript实现继承的几种方式

    原型链最基本的一种继承--过多继承了没用的属性

     1 Grand.prototype.lastName = "Deng";
     2         function Grand() {
     3 
     4         }
     5         var grand = new Grand();
     6 
     7         Father.prototype = grand;
     8         function Father() {
     9             this.name = "123";
    10             this.fortune={
    11                 a:123
    12             }
    13         }
    14         var father = new Father();
    15 
    16         Son.prototype = father;
    17         function Son() {
    18             this.hobbit="smoke";
    19 
    20         }
    21         var son = new Son();
    View Code

    借用构造函数实现继承  -- 每次构造函数都要多走一个函数 无法继承借用构造函数的原型

      function Person(name,age,sex){
                this.name=name;
                this.age=age;
                this.sex=sex;
    
            }
            function Student(name,age,sex,grade){
                Person.call(this,name,age,sex);
                this.grade=grade;
            }
            var student = new Student("a",12,1,1);
    View Code

    共享原型---不能随便改动自己的原型

    Father.prototype.lastName="Deng"
            function Father(){
    
            }
    
            function Son(){
    
            }
            未封装
            Son.prototype=Father.prototype;
            var son = new Son();
            var father = new Father();
    View Code

    我们对共享原型模式加以封装改造

    function Father() {
    
            }
    
            function Son() {
    
            }
            //target 继承 origin
            function inherit(Target, Origin) {
                Target.prototype = Origin.prototype
            }
            //必须先继承后用
            inherit(Son, Father);
            var son = new Son();
    View Code

    圣杯模式(较好的继承实现,一般采用此方式)

    // function inherit(Target, Origin) {
            //     function F() {};
            //     F.prototype = Origin.prototype;
            //     Target.prototype = new F();
            //     Target.prototype.constructor = Target;
            //     Target.prototype.uber = Origin.prototype;
            // }
            //比较专业的写法
            var inherit = (function () {
                var F = function () {};
                return function (Target, Origin) {
                    F.prototype = Origin.prototype;
                    Target.prototype = new F();
                    Target.prototype.constructor = Target;
                    Target.prototype.uber = Origin.prototype;
                }
            }());
            Father.prototype.lastName = "Deng"
    
            function Father() {
    
            }
    
            function Son() {
    
            }
            inherit(Son, Father);
            var son = new Son();
            var father = new Father();
    View Code
  • 相关阅读:
    CSS中z-index的层级树概念
    随记
    PHP 随笔
    linux 相关
    Nginx 虚拟主机 VirtualHost 配置
    PHP 杂记
    Composer 资料
    PHP Yii架构学习
    java 日志技术汇总(log4j , Commons-logging,.....)
    Java 随笔
  • 原文地址:https://www.cnblogs.com/FashionDoo/p/10602771.html
Copyright © 2020-2023  润新知