• class


    class“类”

    • 概述
      这是es6引入的一个概念,class类将会作为对象的模板。基本写法:

        //定义类
        class Point{
        
            constructor(x, y){//构造方法:就是es5中的构造函数
                this.x = x;
                this.y = y;
            }
            
            toString(){
                return '('+this.x+','+this.y+')';
            }
        }
      

    定义构造方法时,前面不需要添加function保留字,另外,方法之间不需要逗号分隔。

    • 创建实例对象
      和es5一样也是使用new命令来创建类的实例对象。

    • name属性
      name属性总是返回紧跟在class关键字后面的类名

        class Point{}
        Point.name //"Point"
      
    • class 表达式
      与函数一样,class也可以使用表达式的形式定义:

        //class表达式
        const MyClass = class Me{
            getClassName(){
                return Me.name;
            }//
        }
      

    上面的表达式定义了一个类,这个类的名字是MyClass,而不是Me。Me只能在class的内部使用,指代当前的类。
    例子:

    	//立即执行的class
    	let person = new class{
    	    constructor(name){
    	        this.name = name;
    	    }
    	
    	    sayName(){
    	        console.log(this.name);
    	    }
    	
    	}("小米");
    	
    	person.sayName();//小米
    
    • 不存在变量提升:
      实例对象在使用前,必须定义该实例对象所继承的类。

    • class的继承

    • class之间通过extends关键字实现继承。

    • 子类必须在constructor方法中调用super方法,这样新创建的实例才会有用,因为子类没有自己的this对象。也就是说,在子类中必须先调用super方法之后,才能使用this关键字。super关键字代表父类的实例。

    • class的取值函数(getter)和存值函数(setter)

    • class的generator方法:在某方法前面加上*号,该方法就成为了generator方法;

    • class的静态方法及静态属性

    • new.target属性
      该属性的作用在于返回new命令所作用的构造函数,如果构造函数不是通过new命令调用的,那么new.target就会返回undefined。

        function Person(name){
            if(new.target === Person){
                this.name = name;
            }else{
                throw new Error("必须使用new生成实例");
            }
        }
        
        var person = new Person('小明');
        //console.log(person);正确
        var person01 = Person.call(person, '小明');
        //console.log(person01);报错
      
    • 只能用来继承,不能实例化的类

        //子类继承父类时new.target会返回子类,所以可以写出不能单独使用,必须继承后才能使用的类
        
        class shape{
            constructor(){
                if(new.target === shape){
                    throw new Error('本类不能实例化');
                }
            }
        }
        
        class angle extends shape{
            constructor(length, width){
                super();
                this.length = length;
            }
        }
        
        //var x = new shape();//报错
        var y = new angle(3, 4);
        console.log(y);
  • 相关阅读:
    react hooks子给父传值
    npm安装依赖 and 删除依赖
    react 阻止事件冒泡
    http 500状态码
    vue中插槽slot的使用
    怎样在vue项目中使用axios处理接口请求
    GET 与 POST 其实没有什么区别
    LazyMan
    什么是微服务,什么是分布式
    思索 p5.js 的最佳实践
  • 原文地址:https://www.cnblogs.com/yehui-mmd/p/7397934.html
Copyright © 2020-2023  润新知