// 06JavaScript的类(构造函数)
// 类:抽象的概念
// 构造函数:对象的构造器 用来构造对象的函数
// 创建一个类(函数) 类名(函数名)首字母大写
// 人类:name age sex hobby
function Person(name,age,sex,hobby) {
this.eyes="黑色";
this.hair="黑色";
this.name=name;
this.age=age;
this.sex=sex;
this.hobby=hobby;
}
// 使用 Person 创建对象
var xiaoming=new Person("小明",20,"男",function(){return "唱歌"});
var xiaohong=new Person("小红",18,"女",function(){return "跳舞"});
console.log(xiaoming);
console.log(xiaohong);
// 工厂
function Car(color){
this.name="比亚迪";
this.price="16.68w";
this.func=function(){
return "买菜"
}
this.color=color;
}
// 生产线
var car1=new Car("红色");
var car2=new Car("白色");
console.log(car1.func());
console.log(car2.func());
// 07JavaScript类添加属性和方法
// 类:抽象的概念
// 构造函数:对象的构造器 用来构造对象的函数
// 工厂
function Car(color){
this.color=color;
}
// prototype 返回原型对象
console.log(Car.prototype);// 原型对象
// 通过 prototype 向原型对象添加属性和方法
Car.prototype.name="比亚迪";
Car.prototype.price="16.68w";
Car.prototype.func=function(){
return "撩妹"
}
// 继承 类 的属性(原型部分)
// 生产线
var car1=new Car("红色");
car1.type="跑车";
var car2=new Car("白色");
console.log(car1);
console.log(car2);
// 08了解JavaScript的this指向
// this关键字 this指向
// 1.在构造函数中使用 指向实例对象
function Car(color) {
this.color = color
}
// 创建car的实例
var car1 = new Car("红色");
var car2 = new Car("黄色");
var car3 = new Car("黑色");
console.log(car1.color);
console.log(car2);
console.log(car3);
// 2.方法(函数)被调用时 事件触发 this指向调用方法的元素
var num1 = document.getElementById("num1");
var num2 = document.getElementById("num2");
var num3 = document.getElementById("num3");
var num4 = document.getElementById("num4");
var num5 = document.getElementById("num5");
var num6 = document.getElementById("num6");
var res=document.getElementById("res");
num1.οnclick=function(){
console.log(this.innerText);
res.value+=this.innerText
}
num2.οnclick=function(){
console.log(this.innerText)
res.value+=this.innerText
}
num3.οnclick=function(){
console.log(this.innerText)
res.value+=this.innerText
}
num4.οnclick=function(){
console.log(this.innerText)
res.value+=this.innerText
}
num5.οnclick=function(){
console.log(this.innerText)
res.value+=this.innerText
}
num6.οnclick=function(){
console.log(this.innerText)
res.value+=this.innerText
}