JavaScript初阶-------- 继承发展史命名空间

Posted 2020-10-16

继承发展史

　　继承发展史一共有四种形式，接下来让我们看看。

　　1.传统形式

     Fir.prototype.lastName = "stg";
             function Fir() {
                 this.age = 25;
             }
             var fir = new Fir();
             Foo.prototype = fir;
             function Foo() { }
             var foo = new Foo();
             Person.prototype = foo;
             function Person() { }

　　

　　从代码中我们可以看出代码看起来很繁琐，不美观，而且继承起来很麻烦，所以这种形式一开始就out了。

 

        缺点：过多的继承了没用的属性。

　　

　　2.借助构造函数

　　　　　　

             function Person1(name,age){ 
                    this.name = name;
                    this.age = age;
                }
                function Person2(name,age){
                    var pObj = Object.create(Person2.prototype);
                    Person1.call(pObj,name,age);
                    return pObj;
                }
                var person = new Person2(‘stg‘,23);

　　

　　　　这种方式本质上不叫继承，因为他是借用call和构造函数，把构造函数Person的this指向改变为自己而已，而且访问不了原型的原型。

　　

　　　　　　缺点：不能继承借用构造函数的原型，每次构造函数都要多走一个函数。

 

     3.共享原型

　　　　

 function inherit(origin,target){
                    target.prototype = origin.prototype;
                }
                Person.prototype.lastName = "xiaoming";
                function Person(){ };
                function Son(){ }
                inherit(Person,Son);

　　 

　　　　　　缺点：不能随意改动自己的原型。

 

　　4.圣杯模式

　　　　　　由于第三种方式中出现的不足，所以我会在中间加一个中间层作为过渡，这也就出现了第四种继承形式-------圣杯模式。

 function inherit(Origin,Target){
        function Func() { };
        Func.prototype = Origin.prototype;
        Target.prototype = new Func();
    }
    Person.prototype.lastName = "hhh";
    function Person () { }
    function Son() { }
    inhert(Person, Son);

　　　　因为第三种形式中Person和Son的原型都是指向同一个原型，所以改变Person的原型就会是Son的原型发生改变，这里我们加入一个中间层函数Func过渡，让它的原型指向Origin的

原型，然后Target的原型继承它的原型，也就是相当于Target原型继承Origin的原型，这样Son改变的时候，Person的原型不会变。再有一点美中不足是，我们知道constructor属性指向的

是构造这个对象的函数，但是这时候son的constructor指向的是Person，因为Func函数里面没有constructor属性，于是便会随着原型链往上找，于是就找到了Person里面，这时候我们需

要手动地给son添加一个constructor属性。

　　　在开发的时候，我们需要一个叫超类（Uber）的东西，用来查询这个函数究竟是继承自谁。最终圣杯模式是这样的：

 function inherit(Origin,Target){
        function Func() { };
        Func.prototype = Origin.prototype;
        Target.prototype = new Func();
        Target.prototype.constructor = Target;
        Target.prototype.uber = Origin.prototype;
    }

　　

　　利用闭包的私有化变量，我们可以将圣杯模式写的更加高级一点

 

var inherit = (function () {
        var Func = function () { };
        return function (origin,target) {
        Func.prototype = Origin.prototype;
        Target.prototype = new Func() ;
        Target.prototype.constructor = Target;
        Target.prototype.uber = Origin.prototype;
    }
}())//**********function与函数Func产生闭包

 

 

---

 

 

命名空间

　　　　　　作用：管理变量，防止污染全局，适用于模块化开发

　　　　　　在开发的时候，往往每个人用到的变量不同，团队开发时就会有变量冲突，我们可以用对象来解决，因为每个对象里面的东西都是独立的，互不干扰。

org = {
    person: {
        xiaoming : {
        age : 20,
        sex : "male"
        },
        xiaozhang : {
        age : 22,
        sex : "female"
        }
    }
}
var per1 = org.person.xiaoming.age;
var per2 = org.person.xiaozhang.age;

 

        采用对象来解决变量冲突问题是以前用的方法，现在我们可以用闭包来解决这一问题。

 

 var add = (function () {
                var count1 = 1;
                var count2 = 0;
                function myAdd(num1, num2){
                    count1 = num1;
                    count2 = num2;
                    console.log(count1 + count2);
                }
                return myAdd(count1,count2);
            }())

 

 

    类似于私有化变量来解决命名冲突，只有在于自己产生闭包的变量才能访问到。