一、ES6---面向对象上的简化
1.单个对象提供了2处简化:
1.1 如果对象的属性来自于对象外的变量,且变量名刚好和属性名相同。则不用写两遍相同的名字,
只要写一遍即可。
1.2 所有对象的方法,不再需要写“:function”
强调:对象中的方法去掉:function,就不等效于箭头函数。突出特点就是this保持原样不变!
所以,去掉:function,只是单纯的简写,没有任何原理的改变。
var eid=1001;
function intrSelf(){
console.log(`我的编号是${this.eid}`);
}
var friends=["亮亮","然然","东东"];
var eric={
eid,// eid:eid,
ename:"诶里克",
intrSelf,// intrSelf:intrSelf
friends,// friends:friends
run(){ //:function(){
console.log(`${this.ename}在奔跑`);
}
}
console.log(eric);
eric.intrSelf();
eric.run();
二、class
什么是:集中定义一种类型的所有对象统一属性结构和方法的程序结构
为什么:每一种类型:Array Student Date都有两部分组成:构造函数+原型对象
构造函数:负责定义所有子对象统一的属性结构,并且负责创建子对象。
原型对象:负责保存所有子对象共有的属性值和方法。
但是,在ES5中,构造函数和原型对象是分开定义的。不符合"封装"的要求。
何时:今后只要希望创建一种自定义类型时,都用class
如何:3件事
1.用class{}包裹构造函数和原型对象方法
2.构造函数名提升为class名,所有构造函数,从此统一更名为constructor
3.所有放在class中的函数,不需要加类型名.prototype前缀,自动就是保存在构造函数的原型对象中。
如何使用class:用法和从前的构造函数完全一样!原型对象的原理依然保持不变。
//1.用class{}包裹构造函数和原型对象方法
class Student{
//2.构造函数名提升为class名,所有构造函数
//更名为constructor
constructor(sname,sage){
this.sname=sname;
this.sage=sage;
}
//3.所有原型对象方法,不用加类型名.prototype前缀!
intrSelf=function(){
console.log(`I'm ${this.sname},I'${this.sage}`);
}
run=function(){
console.log(`${this.sname}开始奔跑....`);
}
}
var lilei=new Student("Li Lei",11);
var hmm=new Student("Han Meimei",12);
console.log(lilei);
console.log(hmm);
lilei.intrSelf();
lilei.run();
hmm.intrSelf();
hmm.run();