<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>class构造函数 16:22</title>
</head>
<body>
<script>
//在java语言中, 没有原型概念 -- 导致学习JS非常难以接受
// JAVA的clas语法, 在底层会自动完成原型的一系列操作
class Rec {
// 所有{}中的函数都会自动添加到 Rec 的原型里, 自动设定权限
// 不需要书写 function 关键词
// constructor: 构造方法 , 固定的方法名
// new运算符会自动触发此方法 new Rec(宽度, 高度)
constructor(width, length) {
this.width = width
this.length = length
}
area() {
return this.width * this.length
}
zc() {
return (this.length + this.width) * 2
}
}
var r1 = new Rec(10, 5)
console.log(r1) //观察原型
console.log(r1.area())
console.log(r1.zc())
</script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>class_super super关键词</title>
</head>
<body>
<script>
class Father {
show() {
console.log('我是父元素的show')
}
}
class Son extends Father {
// 如果子类中重写了 show 方法, 则优先调用自身重写的
show() {
// 关键词: super 代表父元素
super.show() //触发 父元素 Father的show
console.log('我是子元素的show');
}
}
var s1 = new Son()
s1.show()
</script>
</body>
</html>
标签：console,log,show,js,width,ES6class,super,class,构造函数 From： https://www.cnblogs.com/linxinzhi/p/16767599.html