【TypeScript教程】# 14:属性的封装

说明

尚硅谷TypeScript教程(李立超老师TS新课)学习笔记。

属性的封装

现在属性是在对象中设置的,属性可以任意的被修改,属性可以任意被修改将会导致对象中的数据变得非常不安全

比如:

(function() {
    
    
    class Person {
    
    
        name: string;
        age: number;
        constructor(name: string, age: number) {
    
    
            this.name = name;
            this.age = age;
        }
        sayHello() {
    
    

        }
    }

    const per = new Person("kaimo", 18);
    console.log(per);
    per.name = "kaimo313";
    per.age = -313;
    console.log(per);
})()

在这里插入图片描述

public

TS可以在属性前添加属性的修饰符,public 修饰的属性可以在任意位置访问(修改)默认值

属性的存取器

  • getter:方法用来读取属性
  • setter:方法用来设置属性
(function() {
    
    
    class Person {
    
    
        public _name: string;
        public _age: number;
        constructor(name: string, age: number) {
    
    
            this._name = name;
            this._age = age;
        }
        // getName() {
    
    
        //     return this.name;
        // }
        // setName(value:string) {
    
    
        //     this.name = value;
        // }
        // getAge() {
    
    
        //     return this.age;
        // }
        // setAge(value:number) {
    
    
        //     if(value >= 0) {
    
    
        //         this.age = value;
        //     }
        // }
        get name() {
    
    
            return this._name;
        }
        set name(value:string) {
    
    
            this._name = value;
        }
        get age() {
    
    
            return this._age;
        }
        set age(value:number) {
    
    
            if(value >= 0) {
    
    
                this._age = value;
            }
        }
    }

    const per = new Person("kaimo", 18);
    console.log(per);
    // per.setName("kaimo313");
    // per.setAge(-313);
    per.name = "kaimo313";
    per.age = -313;
    console.log(per);
})()

在这里插入图片描述

private

private私有属性, 私有属性只能在类内部进行修改,通过在类中添加方法使得私有属性可以被外部访问

    class A{
    
    
        private num: number;
        constructor(num: number) {
    
    
            this.num = num;
        }
    }
    class B extends A{
    
    
        test(){
    
    
            console. log(this.num);
        }
    }

在这里插入图片描述

protected

protected受包含的属性, 只能在当前类和当前类的子类中访问(修改)

    class A{
    
    
        protected num: number;
        constructor(num: number) {
    
    
            this.num = num;
        }
    }
    class B extends A{
    
    
        test(){
    
    
            console. log(this.num);
        }
    }
    const b = new B(123) ;
    b.num = 33;

在这里插入图片描述

语法糖写法

可以直接将属性定义在构造函数中

    class C{
    
    
        num: number;
        age:number;
        constructor(num: number, age:number) {
    
    
            this.num = num;
            this.age = age;
        }
    }

可以简化成下面的

classC{
    
    
    constructor(public num: number, public age:number) {
    
    
    }
}

猜你喜欢

转载自blog.csdn.net/kaimo313/article/details/127139429
今日推荐