补充:
prototype 属性使您有能力向对象添加属性和方法。
object.prototype.name=value
<script>
function Person(name, age){
this.name = name;
this.age = age;
}
/* Person.prototype.showName = function(){
return `名字为: ${this.name}`;
};
Person.prototype.showAge = function(){
return `年龄为: ${this.age}`;
}; */
//新旧版对比
Object.assign(Person.prototype,{ //assign 合并
showName(){
return `名字为: ${this.name}`;
},
showAge(){
return `年龄为: ${this.age}`;
}
});
let p1 = new Person('Strive', 18);
console.log(p1.showName());
console.log(p1.showAge());
</script>
【ES6】类:ES6里面class没有提升功能,在ES5,用函数模拟可以,默认函数提升
补充:
constructor 属性返回对创建此对象的数组函数的引用。
object.constructor
class Person{//首字母大写!!!
//类:
constructor(name,age){ //构造方法(函数), 调用new时自动执行
//console.log(`构造函数执行了, ${name}, ${age}`);
this.name = name;
this.age = age;
}
showName(){
return `名字为: ${this.name}`;
}
showAge(){
return `年龄: ${this.age}`;
}
}
let p1 = new Person('Strive', 18);
console.log(p1.showName(), p1.showAge());
快捷定义函数: 省打麻烦字
let a = 'strive'; let b = 'method'; class Person{ [a+b](){ } }
this很难出错,若出错:矫正函数
1. fn.call(this指向谁, args1, args2....)
2. fn.apply(this指向谁, [args1, args2....])
3. fn.bind()
【get set】class里面取值函数(getter), 存值函数(setter)
扫描二维码关注公众号,回复: 2865713 查看本文章例:
class Person{ constructor(){ } get aaa(){ return `aaa的属性`; } set aaa(val){ console.log(`设置aaa属性,值为:${val}`); } } let p1 = new Person(); p1.aaa='123'; console.log(p1.aaa);
【静态方法】: 就是类身上方法 可以直接类名调用 不用重新创建json
static aaa(){}
父类.aaa();
继承:
【老方法】
//父类
function Person(name){
this.name = name;
}
Person.prototype.showName = function(){
return `名字是: ${this.name}`;
};
//子类
function Student(name,skill){
Person.call(this,name); //继承属性 //使用矫正this函数
this.skill = skill;
}
Student.prototype = new Person(); //继承方法
//调用
let stu1 = new Student('Strive','逃学');
console.log(stu1.showName());
【新】
//父类
class Person{
constructor(name){
this.name = name;
}
showName(){
return `名字为: ${this.name}`;
}
}
//子类
class Student extends Person{
constructor(name,skill){//别忘了加上参数
super(name);//想写子类自己的构造函数必须super()把父类construct函数拉过来
this.skill = skill;
}
showSkill(){
return `哥们儿的技能为: ${this.skill}`;
}
}
//调用
let stu1 = new Student('Strive','逃学');
console.log(stu1.showSkill());
*子类父类都有同一函数名的函数 怎么办??
【补充】调用父级里函数 格式:super.函数名()
例:
//子类 class Student extends Person{ constructor(name,skill){ super(name); this.skill = skill; } showName(){ super.showName(); //先父级的方法执行 //TODO 可以加做子级事情的其他了 console.log('子类里的showName'); } showSkill(){ return `哥们儿的技能为: ${this.skill}`; } }
在父级函数基础上加上子级自己的函数!