Javascript使用function创建对象的方式一直让人诟病。然而从ES6开始提供了更接近传统语言的写法,引入了 Class(类)这个概念,作为对象的模板。通过class关键字,可以定义类。
1.es5和es6构造实例的区别
ES5的方式:
<script>
//Person为构造函数
function Person(name,age,addr){
this.name = name;
this.age = age;
this.addr = addr;
}
//在构造函数的原型上添加方法
Person.prototype.sayHello=function(){console.log("hello,my name is "+this.name);}
//构造一个实例
let person = new Person('张三',18,'西安市');
//在实例上调用该方法
person.sayHello();
console.log(person);
console.log(person instanceof Object);
</script>
ES6的方式:
<script>
// 类中的this指向创建的实例
class Person{
constructor (name, age,addr) {
this.name = name;
this.age = age ;
this.addr = addr;
}
sayHello(){
console.log("hello,my name is "+this.name);
}
}
//构造一个实例
let person = new Person('张三',18,'西安市');
//在实例上调用该方法
person.sayHello();
console.log(person);
console.log(person instanceof Object);
</script>
我们可以看到通过es6去实现,更容易理解,并且代码量也有所减少。使用这种方式,我们可以清楚的明白,前面使用了class的就是一个类,那么它就有构造实例的能力,并且constructor中放的是每个通过该类构造出来的实例都可以获得属性,在constructor外面放的是可以获得的方法。
2.class基本语法
constructor函数 与java类也可以添加静态属性和静态方法。
<script>
// 类中的this指向创建的实例
class Person{
//静态属性
static nation = 'china';
//静态方法
static worldPeace(){
console.log('I wish world peace!');
}
constructor (name, age,addr) {
this.name = name;
this.age = age ;
this.addr = addr;
}
sayHello(){
console.log("hello,my name is "+this.name);
}
}
//构造一个实例
let person = new Person('张三',18,'西安市');
//在实例上调用该方法
person.sayHello();
Person.worldPeace();
console.log(Person.nation);
console.log(person instanceof Person);
console.log(person instanceof Object);
</script>
运行结果:
hello,my name is 张三
I wish world peace!
china
true
true
需要注意的是,与java语言不同,构造方法可以返回指定类型的实例对象。例如:
<script>
class Person{
constructor () {
return Object.create({});// 改变默认返回的类型
}
}
//构造一个实例
let person = new Person();
console.log(person instanceof Person);
console.log(person instanceof Object);
</script>
运行结果:
false
true