JavaScript中类的静态使用和模块化开发

952 阅读1分钟

静态方法和属性是类的属性和方法,不是实例对象的属性和方法,静态属性不会根据实例化对象的属性改变而改变。静态方法不是针对实例对象来使用的,这个方法是Box类,因此我们通常不在静态方法中使用this,直接使用类名。

    class Box{
            // 静态属性 
            static a=1;
            a=10;
            constructor(_a){
                this.a=_a;
            }
            // 静态方法
            static play(){
                 console.log("aa");
                 Box.a
            }
            play(){

            }

        } 

静态方法中无法调用动态方法,是独立于其它实例对象的方法,为了解决某一类问题的方法,比如说我们一些熟知的数组Array的方法:

        class Array{
            constructor(){

            }
            push(){

            }
            pop(){

            }
            shift(){

            }
            unshift(){

            }
            slice(){

            }
            splice(){

            }
            // 静态方法
            static from(){

            }
            static isArray(){

            }
        }

在类的模块化开发中,建立js文件并通过type类型为module的script标签来写入,export用于对外输出本模块(一个文件可以理解为一个模块)变量的接口,import用于在一个模块中加载另一个含有export接口的模块。(ES6语法)

//创建一个js文件Other.js,写入类,并通过export导出
export class Box{
    constructor(){

    }
    play(){
        console.log("aaa");
    }
}
export class Ball{
    constructor(){

    }
    run(){
        console.log("bbb");
    }
}
    //使用import导入js文件Other.js中的类以及类的属性方法
    <script type="module">
        import {Box,Ball} from "./js/Other.js";
        let a=new Box();  //new一个Box赋给a
        a.play();      //使用Box类中的play方法,打印"aaa"
        let b=new Ball();
        b.run(); 
    </script>