js高級---類/對象創(chuàng)建模式
2021-09-13 15:35:36

        // es5中的類
        // 1.最簡單的類
            function Person(){
                this.name = 'zhangsan';
                this.age = 18;
            }
            var p = new Person();
            console.log(p.anme);
        
        // 2.構(gòu)造函數(shù)和原型鏈里面增加方法
            function Person(){
                this.name = 'zhangsan';
                this.age = 18;
                this.run = function(){
                    console.log(this.name+'在run');
                }
            }
            原型鏈上面的屬性會被多個實例共享 構(gòu)造函數(shù)不會
            Person.prototype.sex = '男'; /* 屬性 */
            Person.prototype.work = function(){ /* 實例方法 */
                console.log(this.name+'在work');
            }
            var p = new Person();
            p.run();
            p.work();
        
        // 3.類里面的靜態(tài)方法
            function Person(){
                this.name = 'zhangsan';
                this.age = 18;
                this.run = function(){
                    console.log(this.name+'在run');
                }
            }
            Person.getGo = function(){
                console.log('我是靜態(tài)方法')
            }
            Person.getGo(); /*調(diào)用靜態(tài)方法 */
        
        // 4.es5里面的繼承
            function Person(){
                this.name = 'zhangsan';
                this.age = 18;
                this.run = function(){
                    console.log(this.name+'在run');
                }
            }
            Person.prototype.sex = '男'; /* 屬性 */
            Person.prototype.work = function(){ /* 實例方法 */
                console.log(this.name+'在work');
            }
            // 定義一個 web類繼承 Person類 (原型鏈+對象冒充的組合模式)
            function Web(){
                Person.call(this)  /* 對象冒充實現(xiàn)繼承*/
            }
            var w = new Web();
            w.run(); //對象冒充可以繼承構(gòu)造函數(shù)里面的屬性和方法
            w.work(); //但是不能繼承原型鏈上邊的屬性和方法
        
        // 5.es5里的繼承  原型鏈實現(xiàn)繼承
            function Person(){
                this.name = 'zhangsan';
                this.age = 18;
                this.run = function(){
                    console.log(this.name+'在run');
                }
            }
            Person.prototype.sex = '男'; /* 屬性 */
            Person.prototype.work = function(){ /* 實例方法 */
                console.log(this.name+'在work');
            }
            // 定義一個 web類繼承 Person類 (原型鏈+對象冒充的組合模式)
            function Web(){}
             //原型鏈實現(xiàn)繼承:可以繼承構(gòu)造函數(shù)里面的方法和屬性  也可以繼承原型鏈上邊的屬性和方法
            Web.prototype = new Person();
            var w = new Web();
            w.work(); //
        
        // 6.原型鏈實現(xiàn)繼承的   問題？
            function Person(name,age){
                this.name = name;
                this.age = age;
                this.run = function(){
                    console.log(this.name+'在run');
                }
            }
            Person.prototype.sex = '男'; /* 屬性 */
            Person.prototype.work = function(){ /* 實例方法 */
                console.log(this.name+'在work');
            }
            // 定義一個 web類繼承 Person類 (原型鏈+對象冒充的組合模式)
            function Web(name,age){}
            //原型鏈實現(xiàn)繼承:可以繼承構(gòu)造函數(shù)里面的方法和屬性  也可以繼承原型鏈上邊的屬性和方法
            Web.prototype = new Person();
            var w = new Web('xiaolin',18); //實例化子類的時候不能給父類傳參
            var w1 = new Web('xiaohong',17);
            w.work(); //undefined在work
        
        // 7.原型鏈+構(gòu)造函數(shù) 的組合繼承模式
            function Person(name,age){
                this.name = name;
                this.age = age;
                this.run = function(){
                    console.log(this.name+'在run');
                }
            }
            Person.prototype.sex = '男'; /* 屬性 */
            Person.prototype.work = function(){ /* 實例方法 */
                console.log(this.name+'在work');
            }
            // 定義一個 web類繼承 Person類 (原型鏈+對象冒充的組合模式)
            function Web(name,age){
                Person.call(this,name,age) //對象冒充繼承 實例化子類可以給父類傳參
            }
            //原型鏈實現(xiàn)繼承:可以繼承構(gòu)造函數(shù)里面的方法和屬性  也可以繼承原型鏈上邊的屬性和方法
            Web.prototype = new Person();   //或者  Web.prototype = Person.prototype;
            var k = new Web('小米',20);
            k.run(); //小米在run
            k.work(); //小米在work