• js中的类


    // es5中的类
    // a.最简单的类
        // function Person(){
        //     this.name = 'zhangsan';
        //     this.age = 18;
        // }
        // var p = new Person();
        // console.log(p.anme);
    
    // b.构造函数和原型链里面增加方法
        // 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');
        // }
        // var p = new Person();
        // p.run();
        // p.work();
    
    // c.类里面的静态方法
        // function Person(){
        //     this.name = 'zhangsan';
        //     this.age = 18;
        //     this.run = function(){
        //         console.log(this.name+'在run');
        //     }
        // }
        // Person.getGo = function(){
        //     console.log('我是静态方法')
        // }
        // Person.getGo(); /*调用静态方法 */
    
    // d.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)  /* 对象冒充实现继承*/
        // }
        // var w = new Web();
        // w.run(); //对象冒充可以继承构造函数里面的属性和方法
        // w.work(); //但是不能继承原型链上边的属性和方法
    
    // e.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(){}
        //  //原型链实现继承:可以继承构造函数里面的方法和属性  也可以继承原型链上边的属性和方法
        // Web.prototype = new Person();
        // var w = new Web();
        // w.work(); //
    
    // f.原型链实现继承的   问题?
        // 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){}
        // //原型链实现继承:可以继承构造函数里面的方法和属性  也可以继承原型链上边的属性和方法
        // Web.prototype = new Person();
        // var w = new Web('xiaolin',18); //实例化子类的时候不能给父类传参
        // var w1 = new Web('xiaohong',17);
        // w.work(); //undefined在work
    
    // g.原型链+构造函数 的组合继承模式
        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) //对象冒充继承 实例化子类可以给父类传参
        }
        //原型链实现继承:可以继承构造函数里面的方法和属性  也可以继承原型链上边的属性和方法
        Web.prototype = new Person();   //或者  Web.prototype = Person.prototype;
        var k = new Web('小米',20);
        k.run(); //小米在run
        k.work(); //小米在work
  • 相关阅读:
    Mybatis plus 多表连接分页查询
    webstorm自动格式化.vue文件并符合Eslint
    Selenium python爬虫
    Cent OS防火墙配置端口开放
    开发Hexo主题(一)
    谷歌开发者主页回归
    个人博客网站
    linux搭建ftp
    putty之pscp上传文件
    送走了最好的兄弟 收到上交复试通知
  • 原文地址:https://www.cnblogs.com/qxp140605/p/11531162.html
Copyright © 2020-2023  润新知