TS学习笔记07 封装

TS学习笔记07 封装

将类的属性封装在类中，不允许在类的外部直接访问，保护数据的安全，使内容可控 。

只能通过被授权的方法才能对数据进行访问，称为存取器 getters/setters 。

可以看下面的代码：

以下划线为开头命名私有变量

class Person{
    public name:string = 'tom';  // 默认就是public修饰符
    protected age:number = 18;
    private hobby:string = 'game';

    // 不允许直接访问该属性，命名上一般以下划线_开头
    private _sex:string = 'male';
}

​ 如果这个时候想直接在外部访问，会出现这样的问题:

那么如果想要访问类的内部方法，那么需要怎样操作：

1. 取值： get 新属性名(){ 控制私有属性的取值 }

class Person{
    public name:string = 'tom';  // 默认就是public修饰符
    protected age:number = 18;
    private hobby:string = 'game';

    // 不允许直接访问该属性，命名上一般以下划线_开头
    private _sex:string = 'male';

    /**
     * 提供get/set存取器，用来对属性进行访问
     */
    //其中get表示的是get方法，sex()表示的新的属性，此时不需要用下划线开头
    get sex(){
        console.log('获取_sex值');
        return this._sex;
    }
}

​ 此时调用这个sex()方法就比较简单了，直接访问即可。

let p = new Person();
console.log(p.sex);

2. 赋值： set 新属性名(新值){ 控制私有属性的赋值 }

class Person{
    public name:string = 'tom';  // 默认就是public修饰符
    protected age:number = 18;
    private hobby:string = 'game';

    // 不允许直接访问该属性，命名上一般以下划线_开头
    private _sex:string = 'male';

    // 静态属性，属于整个类，并不属于某个实例所特有
    static address:string = '南京';

    /**
     * 提供get/set存取器，用来对属性进行访问
     */
    //其中get表示的是get方法，sex()表示的新的属性，此时不需要用下划线开头
    get sex(){
        console.log('获取_sex值');
        return this._sex;
    }
    
    set sex(value){
       console.log('为_sex赋值');
       this._sex = value;
    }
}

​ 此时赋值操作也很简单，直接赋值即可。

let p = new Person();
p.sex = 'female';

3. 这时候或许有同学会疑问，那这样和普通的存取值有什么区别？

​ 区别在于，此时对数据的操作是通过存取器来进行的，也就是说我们可以在get()或者set()方法里面添加校验规则或者限制条件。看如下代码：

​ 我可以取值的时候都返回给我大学的值，存值的时候只能为性别。

class Person{
    public name:string = 'tom';  // 默认就是public修饰符
    protected age:number = 18;
    private hobby:string = 'game';

    // 不允许直接访问该属性，命名上一般以下划线_开头
    private _sex:string = 'male';

    show(){
        console.log(this.name);
        console.log(this.age);
        console.log(this.hobby);
    }

    /**
     * 提供get/set存取器，用来对属性进行访问
     */
    get sex(){
        console.log('获取_sex值');
        return this._sex.toUpperCase();
    }
    
    set sex(value){
        console.log('为_sex赋值');
        if(value=='male'||value=='female'){
            this._sex = value;
        }else{
            console.log('错误：性别只能为：male、female');
        }
    }
}

静态属性：属于整个类，并不属于某个实例所特有。

 static address:string = '南京';

​ 访问静态属性：

// console.log(p.address); // 报错，不能通过 对象名.属性 访问
console.log(Person.address); // 静态属性要通过  类名.属性 访问