es6中类和对象的三个注意点
程序员文章站
2022-06-24 16:37:59
es6中类和对象的三个注意点1.在es6中类没有变量的提升，所以必须先定义类，才能通过类的实例化。2.在类*有的属性和方法一定要通过this调用class Star { constructor(name) { this.name = name; this.sing(); } //3.添加共有方法 sing() { console.log(this.name); }}在一个类中有不同函数中可能会用到之前函数的变量，js不像java或c++,可以通过...
es6中类和对象的三个注意点
1.在es6中类没有变量的提升，所以必须先定义类，才能通过类的实例化。
2.在类*有的属性和方法一定要通过this调用
class Star {
constructor(name) {
this.name = name;
this.sing();
}
//3.添加共有方法
sing() {
console.log(this.name);
}
}
在一个类中有不同函数中可能会用到之前函数的变量，js不像java或c++,可以通过public定义共有的属性。在js里共有的属性和方法都是直接加到this里,this就是指向实例化对象。只要是这个实例化对象里的共有函数和属性，都可以直接通过this调用。
3.类里边this的指向问题
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>三大注意点</title>
</head>
<body>
<button>点我</button>
<script>
let that = null;//用来保存constructor里边的this
let that2 = null;//用来保存dance里边的this
let that3 = null;//用来保存sing里边的this
class Star {
constructor(name) {
//constructor里边的this指向 创建的实例对象
that = this;
this.name = name;
//获取按钮
this.btn = document.querySelector('button');
this.btn.onclick = this.sing;//注意sing后不要有括号，不是立即执行
}
sing() {
//该处的this指向其调用者btn按钮
that3 = this;
console.log(this);//<button>
console.log(that.name);//唐天佑,that全局变量中保存的是TTY实例化对象自然可调用name
}
dance() {
//谁调用该方法this指向谁,也就是说指向实例化对象
that2 = this;
console.log(this);//TTY这个实例化对象
}
}
let TTY = new Star('唐天佑');
console.log(TTY === that)//true
TTY.dance();
console.log(TTY === that2)//true
console.log(TTY === that3)//false
</script>
</body>
</html>
constructor里边的this指向实例对象，方法里边的this指向这个方法的调用者。
本文地址：https://blog.csdn.net/LIUCHUANQI12345/article/details/110944763
上一篇： JS仿京东放大镜
推荐阅读