<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<meta http-equiv="X-UA-Compatible" content="ie=edge"/>
<title>Document</title>
<script>
function Person(name, sex, age){
this.name = name;
this.sex = sex;
this.age = age;
}
Person.prototype.showSelf = function(){
alert(`我是一个叫${this.name},今年${this.age}岁的${this.sex}孩`);
}
//白领人
function Worker(name, sex, age, job){
//1、构造函数的伪装 -- 继承父级的属性
Person.call(this, name, sex, age);
this.job = job;
}
//2、原型链 继承父一级的方法
//<1>通过for...in遍历继承
for(var funcName in Person.prototype){
Worker.prototype[funcName] = Person.prototype[funcName];
}
//<2>Object.create()
// Worker.prototype = Object.create(Person.prototype);
//<3>调用构造函数继承
Worker.prototype = new Person();
Worker.prototype.showJob = function(){
alert("我的工作是" + this.job);
}
var w1 = new Worker("小米", "男", 20, "程序员");
w1.showSelf();
w1.showJob();
//ECMA6class语法
// class Person{
// //class属性添加
// constructor(name, sex, age){
// this.name = name;
// this.sex = sex;
// this.age = age;
// }
// showSelf(){
// alert(`我是一个叫${this.name},今年${this.age}岁的${this.sex}孩`);
// }
// }
//
// var p1 = new Person("blue", "男", 18);
// p1.showSelf();
//
// //extends 继承
// class Worker extends Person{
// constructor(name, sex, age, job){
// //1、继承到父一级的属性
// super(name, sex, age);
// this.job = job;
// }
// showJob(){
// alert("我的工作是" + this.job);
// }
// }
//
// var w1 = new Worker("小米", "男", 20, "程序员");
// w1.showSelf();
// w1.showJob();
</script>
</head>
<body>
</body>
</html>
ES6语法
最新推荐文章于 2024-05-09 15:03:07 发布