es6 对象

1. 对象的扩展

    {  
     // js5 写法
        var obj = {
            'name': '123',
            'age': '18',
            'say': function () {
                console.log(234);
            }
        }
    }
{   
  // es6 写法:
    let name = '123';
    let age = 12;
    let obj = {
        name,
        age,
        say(){
            console.log(12345);
            return 123;
        },
    }
    console.log(obj.name);     // 123
    console.log(obj.age);      // 12
    console.log(obj.say());    // 12345
 }

2. 面向对象

  • 在JS5中, 没有一个类的概念,只有构造方法。
  • 而 ES6中, JS 模拟了其他语言,实现类的概念,让对象可以由类来产生。
  • ES6 中虽然有了类 但底层实现上 还是以原型对象的拷贝来实例化对象。

总结

  • class : 定义类的关键字
  • extends : 子类继承父类 (定义子类时使用)
  • constructor : 构造函数
  • static : 定义类属性 调用时类使用它
  • super : 代表父类

1. 使用class 关键字封装类。

  • 从底层上来讲,在类里面定义的属性和方法 都是之前的原型属性和方法。
class Person {
        name = '张三';
        age = '12';
        say() {
            console.log('hello');
        }
        eat(){
            console.log('这是父类的方法');
        }
        // 需要传参的属性 写在 构造函数里面。
        constructor(sex, job, money) {
            this.sex = sex;
            this.job = job;
            this.money = money;
        }
    }

    // 实例化对象
    // 类中构造函数里写了多少个形参, 实例化的时候就要按顺序,传入多少个实参。
    // 如果形参实参数量不一致,没传参的属性,值是 undefined
    let p1 = new Person('男', '程序员');
    console.log(p1.name, p1.age);
    console.log(p1.job);
    p1.say();

2. es6 继承

    1. 在类中,使用自身用 this 来使用
      this.属性
      this.方法()
    1. 在子类中,要使用父类的属性或方法 只能用 super
    • super.方法()
    • 只有一种情况,super 如果在子类的constructor中代表着父类的 constructor
 class Man extends Person{
        sex = '男';
        // static 修饰类属性 / 类方法
        // 只有类才能使用的属性和方法, 只能通过类名调用
        static a = '123'; 
        static says(){
            console.log(super.name);   
        } 
        fn1(){
            this.eat();
            console.log(this.sex);
        }
        eat(){
            // 将父类的方法 在子类调用
            super.eat();
            console.log('这是子类的方法');
        }
        constructor(...arg){
            console.log(Man.a);
            Man.says();
            // super 如果放在 子类的构造函数中 直接代表父类的构造函数。
            // super(arg[0],arg[1],arg[2]);
            super(...arg);
        }
    }

    let m1 = new Man('女', '程序员','1234');
    console.log(m1.job,m1.sex,m1.money);
    console.log(m1.name,m1.sex);
    // console.log(m1.says());  // 报错 m1.says is not a function
    console.log(Man.a);
    Man.says();
    m1.eat();
    m1.fn1();

3. 私有属性和方法 set、get

 class Person{
        constructor(){
            this.money = 2345;    // 公有
            let money1 = 2345;    // 私有
        }
        _money = 2345;      // 私有属性:
        // set get 方法
        set m1(m){
            this._money = m + 10000;
        }
        get m1(){
            return this._money;
        }
    }

    let p1 = new Person();
    console.log( p1.money1);
    console.log( p1._money);
    console.log(p1.m1);   // 2345 给私有属性一开始设置的那个值
    p1.m1 = 5000;
    console.log(p1.m1);
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容