关于javascript:JavaScript笔记面向对象编程1创建类与类的继承

36次阅读

共计 1958 个字符,预计需要花费 5 分钟才能阅读完成。

面向对象编程

类形象了对象的公共局部 它泛指某一大类 (class)

ES6 之前 js 并不存在类这个概念

ES6 公布于 2015 年 目前有一些高版本的浏览器反对 然而也只反对其局部性能 大部分还是只反对 ES5

在 ES6 没有公布之前 对象不是由类创立的 而是由构造函数创立的

对象特指某一个 通过类实例化一个具体的对象

所以概括一下 类是公共的属性和行为

对象是一个具体的例子。

对于类的创立。

    //1. 创立类 class 这里创立一个明星类
        class Star {constructor(uname, age) {
                this.uname = uname;
                this.age = age;
            }
            sing(song) { // 不必加 function 这个关键字
                console.log(this.uname + song);

            }
        }
        //2. 利用类创建对象 new 并存储在一个变量里
        var ldh = new Star('刘德华', 18);
        var zxy = new Star('张学友', 20);
        console.log(ldh);
        console.log(zxy);
        zxy.sing('李香兰'); // 输入张学友李香兰

        // 注意事项 1 通过 class 关键字来创立类 类名第一个字母大写 约定风俗
        // 注意事项 2 类外面有个 constructor 函数 也就是构造函数 能够承受传递过去的参数 同时返回实例对象
        // 注意事项 3 构造函数 constructor 只有 new 生成实例时 就会被主动调用
        // 注意事项 4 new 这个关键字不能够省略
        // 注意事项 5 咱们类外面 增加新的办法 不须要 function 关键字
        // 注意事项 6 多个函数之间不须要用逗号分隔

对于类的继承
应用 extends 关键字

        class Father {constructor() { }
            getmoney() {console.log('我继承了 100');

            }
        }
        class Son extends Father {
            // 子类是空的 也不要紧 因为继承了父类 所以父类外面的属性和办法是能够应用的
            // 这里是不波及 this

        }
        var little_son = new Son();
        little_son.getmoney();

当父类中波及 this 的时候

class Father {constructor(x, y) {
                    this.x = x;
                    this.y = y;
                }
                sum() {console.log(this.x + this.y);

                }
            }
            class Son extends Father{constructor(x,y)
                {   this.x=x;
                    this.y=y;

                }
            }
            var little_son= new Son(1,3);
            little_son.sum();
            

以上代码会报错 理由是因为 sum 函数中的 this 指向的是父类的 constructor 外面蕴含的 this 数据

而在儿子调用这个函数的时候 (1,3)是传给了子类的 constructor,这个 constructor 外面的 this.x this.y 与父类指向的是不一样的

解决这个问题的办法就是用 super 关键字


        class Father {constructor(x, y) {
                    this.x = x;
                    this.y = y;
                }
                sum() {console.log(this.x + this.y);

                }
            }
            class Son extends Father{constructor(x,y)
                {super(x,y); // 调用了父类中的构造函数(一般函数也能够用 super)
                    
                }
            }
            var little_son= new Son(1,3);
            little_son.sum();
            // 以上不会报错

说白了 super 容许咱们调用父类外面的 constructor。

更多对于继承的例子。

        class Father {say() {return '我是爸爸';}
        }

        class Son extends Father {say() {console.log(super.say() + '的儿子');

            }
        }
        var little_son = new Son();
        son.say();// 打印后果:我是爸爸的儿子 利用 super 调用 father 外面的个别函数
// 父类有加法办法
class Father{constructor(x,y){
    this.x=x;
    this.y=y;
}
sum(){console.log(this.x+ this.y);
    
}
}

class Son extends Father {constructor(x,y){super(x,y); //super 必须在 this 之前 
    this.x=x;// 先通过这一步 而后由 super 传递到父类
    this.y=y;

}
subtract(){console.log(this.x-this.y); // 这里必须用 this.x this.y 
// 如果你 只用 x y 会报错 uname 也同理
    
}
}

var son_shili=new Son(5,3);
son_shili.subtract();
son_shili.sum();// 不会报错

正文完
 0