• ES6_class知识


    ES6的class 类

    在ES6中,class作为对象的模板被引入,可以通过class关键字定义类。

    class的本质是function。

    class可以看做是一个语法糖,让对象原型的写法更加清晰、更像面向对象编程的语法

    类的定义

    类表达式可以为匿名或者命名。

    // 匿名类
    let Example = class {
        constructor(a) {
            this.a = a;
        }
    }
    // 命名类
    let Example = class Example {
        constructor(a) {
            this.a = a;
        }
    }
    

    类的声明

    class Example {
        constructor(a) {
            this.a = a;
        }
    }
    

    注意要点:不可重复声明。

    class Example{}
    class Example{}
    // Uncaught SyntaxError: Identifier 'Example' has already been 
    // declared
     
    let Example1 = class{}
    class Example{}
    // Uncaught SyntaxError: Identifier 'Example' has already been 
    // declared
    

    注意点:

    1. 类定义不会被提升,这意味着,必须在访问前对类进行定义,否则就会报错。如下代码

    2. 类中方法不需要function关键字。

    3. 方法间不能加分号。

      new Example(); 
      class Example {}
      Uncaught TypeError: Example is not a construtor
      

    类的主体(属性)

    静态属性:class本身的属性,即直接在类内部的属性,不需要实例化。 ES6 中规定,Class 内部只有静态方法,没有静态属性。

    公共属性:

    class Example{}
    Example.prototype.a = 2;
    
    class Example{}
    Example.prototype.a = "a";
    Example.b = "b";
    
    console.log(new Example().a);  //"a",公共属性
    console.log(Example.b);     // "b",静态属性
    

    实例属性:定义在实例对象(this)上的属性

    name属性:返回跟在class后的类名(存在时)。

    let Example=class Exam {
        constructor(a) {
            this.a = a;
        }
    }
    console.log(Example.name); // Exam
     
    let Example=class {
        constructor(a) {
            this.a = a;
        }
    }
    console.log(Example.name); // Example
    

    类的主体(方法)

    constructor方法

    是类的默认方法,创建类的实例化对象时被调用。

    class Example{
        constructor(){
          console.log('我是constructor');
        }
    }
    new Example(); // 我是constructor
    

    返回对象

    class Test {
        constructor(){
            // 默认返回实例对象 this
        }
    }
    console.log(new Test() instanceof Test); // true
     
    class Example {
        constructor(){
            // 指定返回对象
            return new Test();
        }
    }
    console.log(new Example() instanceof Example); // false
    

    静态方法

    class Example{
        static sum(a, b) {
            console.log(a+b);
        }
    }
    Example.sum(1, 2); // 3
    

    原型方法

    class Example {
        sum(a, b) {
            console.log(a + b);
        }
    }
    let exam = new Example();
    exam.sum(1, 2); // 3
    

    实例方法

    class Example {
        constructor() {
            this.sum = (a, b) => {
                console.log(a + b);
            }
        }
    }
    

    类的实例化

    class 的实例化必须通过 new 关键字。

    class Example {}
     
    let exam1 = Example(); 
    // Class constructor Example cannot be invoked without 'new'
    

    实例化对象

    共享原型对象

    class Example {
        constructor(a, b) {
            this.a = a;
            this.b = b;
            console.log('Example');
        }
        sum() {
            return this.a + this.b;
        }
    }
    let exam1 = new Example(2, 1);
    let exam2 = new Example(3, 1);
    console.log(exam1._proto_ == exam2._proto_); // true
     
    exam1._proto_.sub = function() {
        return this.a - this.b;
    }
    console.log(exam1.sub()); // 1
    console.log(exam2.sub()); // 2
    

    封装与继承

    getter/setter

    定义

    class Example{
        constructor(a, b) {
            this.a = a; // 实例化时调用 set 方法
            this.b = b;
        }
        get a(){
            console.log('getter');
            return this.a;
        }
        set a(a){
            console.log('setter');
            this.a = a; // 自身递归调用
        }
    }
    let exam = new Example(1,2); // 不断输出 setter ,最终导致 RangeError
    class Example1{
        constructor(a, b) {
            this.a = a;
            this.b = b;
        }
        get a(){
            console.log('getter');
            return this._a;
        }
        set a(a){
            console.log('setter');
            this._a = a;
        }
    }
    let exam1 = new Example1(1,2); // 只输出 setter , 不会调用 getter 方法
    console.log(exam._a); // 1, 可以直接访问
    

    getter 不可单独出现

    class Example {
        constructor(a) {
            this.a = a; 
        }
        get a() {
            return this.a;
        }
    }
    let exam = new Example(1); // Uncaught TypeError: Cannot set property // a of #<Example> which has only a getter
    

    getter 与 setter 必须同级出现

    class Father {
        constructor(){}
        get a() {
            return this._a;
        }
    }
    class Child extends Father {
        constructor(){
            super();
        }
        set a(a) {
            this._a = a;
        }
    }
    let test = new Child();
    test.a = 2;
    console.log(test.a); // undefined
     
    class Father1 {
        constructor(){}
        // 或者都放在子类中
        get a() {
            return this._a;
        }
        set a(a) {
            this._a = a;
        }
    }
    class Child1 extends Father1 {
        constructor(){
            super();
        }
    }
    let test1 = new Child1();
    test1.a = 2;
    console.log(test1.a); // 2
    

    extends

    通过 extends 实现类的继承。

    class Child extends Father { ... }
    

    super

    子类constructor方法中必须有super,且必须出现在this之前。

    class Father {
        constructor() {}
    }
    class Child extends Father {
        constructor() {}
        // or 
        // constructor(a) {
            // this.a = a;
            // super();
        // }
    }
    let test = new Child(); // Uncaught ReferenceError: Must call super 
    // constructor in derived class before accessing 'this' or returning 
    // from derived constructor
    

    调用父类构造函数,只能出现在子类的构造函数。

    class Father {
        test(){
            return 0;
        }
        static test1(){
            return 1;
        }
    }
    class Child extends Father {
        constructor(){
            super();
        }
    }
    class Child1 extends Father {
        test2() {
            super(); // Uncaught SyntaxError: 'super' keyword unexpected     
            // here
        }
    }
    

    调用父类方法, super 作为对象,在普通方法中,指向父类的原型对象,在静态方法中,指向父类

    class Child2 extends Father {
        constructor(){
            super();
            // 调用父类普通方法
            console.log(super.test()); // 0
        }
        static test3(){
            // 调用父类静态方法
            return super.test1+2;
        }
    }
    Child2.test3(); // 3
    

    注意要点:不可继承常规对象

    var Father = {
        // ...
    }
    class Child extends Father {
         // ...
    }
    // Uncaught TypeError: Class extends value #<Object> is not a constructor or null
     
    // 解决方案
    Object.setPrototypeOf(Child.prototype, Father);
    
  • 相关阅读:
    Web 服务编程,REST 与 SOAP
    ODI调用WebService---->OdiInvokeWebService
    Using Custom Java code in ODI
    ODI---->Variables
    Oracle---->Join
    SQLserver中用convert函数转换日期格式
    ORA-00942 表或视图不存在
    GoldenGate 12c + Oracle 12c Multitenant Container databases
    goldengate 12c 针对oracle 12c配置的主要变化
    GoldenGate 配置extract,replicat进程自启动
  • 原文地址:https://www.cnblogs.com/zdjBlog/p/12564449.html
Copyright © 2020-2023  润新知