javascript 类定义常见注意事项

javascript 类定义常见注意事项

1、类中不可以用function定义方法

2、类中的构造函数可以定义,也可以不定义,不定义的情况下系统会自动补充一个默认的constructor(){} 构造函数

3、类的静态变量,必须用类名才可以访问到,类申请出来的变量,是访问不到该静态变量的,只会动态为对象 新增一个非静态变量。

4、类中的变量可以显示申明,但是不能使用 let、const、var关键字。也可以不申明,用到的时候用this.xxx,进行动态创建。

5、可以使用属性构造器,用定义方法的方式,定义属性。优势是可以为属性的访问时,增加自定义逻辑触发。

6、由于不能用const方法,申请变量,如果要定义只读属性,可以使用get 构造器定义一个返回常数的方式( return "常数" ),变相定义一个只读属性。

7、使用 Object.freeze 修饰对象,可以让对象类的属性变得不可更改。

javascript 复制代码
    class Person{
        userName; //在类中,不可以用let、const、var等申明属性
        //expectJob   属性也可以不申明,直接使用,也是正确的使用方法。
        static nickName;//  注意这里是静态类,只有使用类名Person.nickName,才能访问到他,用对象.nickName,是访问不到它的,只会新创建一个非静态的nickName。
        constructor(name,job='coding'){  //构造函数也可以不定义,系统会自动补充一个默认的constructor(){}
            this.userName=name;
            this.expectJob=job;//属性也可以不申明,直接使用
        }
        getName(){
            return this.userName;
        }

        getExpectJob(){
            return this.expectJob;
        }

        getNickName(){
            return this.nickName;
        }

        setNickName(value){
            return this.nickName=value;
        }

        getStaticNickName(){
            return Person.nickName;
        }

        setStaticNickName(value){
            return Person.nickName=value;
        }

        //只读属性构造器,访问的时候只需要用Person.PI ,如果用该类申请的对象person.PI是访问不到该属性的。
        // 这里还有个属性构造器的概念。 属性构造器只需要用get xx(),set xx(value),就可以定义出属性,静态非静态都可以定义。
        static get PI() {  //
            return 3.14159265359;
        }

        //用Object.freeze 冻结对象,使得对象属性/变量 不可以修改
        static get DEFAULT_CONFIG() {
            return Object.freeze({
                theme: 'dark',
                language: 'zh-CN',
                version: '1.0.0'
            });
        }
    }

    //这里没有传递函数,相当于new Person(undefined,undefined),
    // 由于job有默认值coding,最终expectJob被初始化为coding
    const  person=new Person();
    person.setNickName('Alice');
    person.setStaticNickName('Static Alice');
    console.log(`person.getName() = ${ person.getName() }`); // undefined
    console.log(`person.getExpectJob() = ${ person.getExpectJob() }`); // coding
    console.log(`person.expectJob = ${ person.expectJob }`); // undefined
    console.log(`person.getNickName() = ${ person.getNickName() }`); // Alice
    console.log(`person.getStaticNickName() = ${ person.getStaticNickName() }`); //Static Alice
    console.log(`Person.nickName = ${ Person.nickName }`);// Static Alice
    console.log(`person.nickName = ${ person.nickName }`);// Alice
    console.log(`Person.PI = ${ Person.PI }`); // 3.14159265359
    console.log(`Person.PI = ${ person.PI }`); // undefined

    Person.DEFAULT_CONFIG.theme = 'light';  // 静默失败(被冻结) ,只能用Person类访问
    console.log(`Person.DEFAULT_CONFIG.theme = ${ Person.DEFAULT_CONFIG.theme }`); //dark

浏览器console输出内容:

相关推荐
动能小子ohhh10 分钟前
DocForge平台的设计与开发--文件上传接口的实现
开发语言·人工智能·python·langchain·ocr·fastapi
满天星830357714 分钟前
【Qt】信号和槽(二) (自定义信号和槽)
开发语言·数据库·qt
初一初十17 分钟前
vue3实现的纯前端护肤品商城网站
前端·javascript·vue.js·前端框架
卷帘依旧19 分钟前
React状态管理方案怎么选
前端
zeqinjie24 分钟前
Flutter 折叠屏 iPad / 宽屏适配实践
android·前端·flutter
超哥--40 分钟前
B站视频内容智能分析系统(三):B站视频自动采集
java·开发语言·音视频·ai编程
小村儿41 分钟前
连载13- 内部Tools,Claude Code 怎么真正"动"你的代码
前端·后端·ai编程
IT_陈寒42 分钟前
Python的线程池把我坑惨了,原来异步不是万能的
前端·人工智能·后端
夏语灬43 分钟前
cryptography:Python 密码学标准库的终极选择
开发语言·python·密码学
Jun6261 小时前
QT(19)-VISA控制仪器
开发语言·qt