首页 > it技术 > >
Javascript——面向对象
2021-10-12
了解面向对象
面向对象是对面向过程的高度封装（高内聚低耦合）
在开发过程中，我们需要完成某一个功能时，但是 JS 没有能够完成这项功能的对象，我们创建一个可完成这项功能的对象
创建的对象是一个 有属性 、有方法、并且合理的
一种面向对象语言需要向开发者提供四种基本能力
封装 - 把相关的信息（无论数据或方法）存储在对象中的能力
聚集 - 把一个对象存储在另一个对象内的能力
继承 - 由另一个类（或多个类）得来类的属性和方法的能力
多态 - 编写能以多种方法运行的函数或方法的能力
创建对象的方式
字面量创建：var obj = {}
内置构造函数创：var obj new Object()
工厂函数创建：自己书写工厂函数，使用自己书写的工厂函数进行创建对象
// 创建工厂函数
function createPerson(name, age){
// 手动创建一个对象
var person = new Object();
// 手动向对象添加成员
person.name = name;
person.age = age;
// 创建方法
person.showName = function(){
alert("姓名："+this.name);
}
person.showAge = function(){
alert("年龄："+this.age);
}
// 返回添加成员和方法的对象
return person;
}
//创建两个对象
var p1 = createPerson("jiangzhou", 22);
var p2 = createPerson("tom", 20);
//调用对象方法
p1.showName();
p1.showAge();
p2.showName();
p2.showAge();
自定义构造函数创建
function createObj(name,age){
// 会自动进行创建一个对象// 手动添加成员
this.namee=name // this 指向当前创建对象的变量
this.age=age// this 指向当前创建对象的变量
// 创建方法
this.showName = function(){
alert("姓名："+this.name);
}
this.showAge = function(){
alert("年龄："+this.age);
}
// 自动返回对象
}
let obj=new createObj('Jack', 18)
//调用对象方法
p1.showName();
p1.showAge();
p2.showName();
p2.showAge();
构造函数的书写与使用规范
明确这是一个构造函数，而不是普通函数，构造函数在调用时需要与 new 连用
构造函数的目的就是为了创建一个 有属性 有方法 合理的 对象
如果调用时没有使用 new 关键字，无法创建一个对象
如果构造函数内书写了 return 关键字，返回的是基本数据类型，return 无效，如果返回的是复杂数据类型，构造函数无效
构造函数在调用时，如果不需要传参，可以省略后面小括号（一般建议不省略）
构造函数命名一般为首字母大写（用于区分普通函数）
构造函数与 new 关键字连用时，会创造一个对象，这个对象叫做实例对象；创建对象的过程叫做实例化的过程；构造函数体内的 this 指向当前实例对象（本次创建对象的那个变量
function Person(name){
this.name = name
}
/*
在 new 的时候，Person 会创造一个对象，并将对象赋值给变量 p ，这个 变量 p
叫做 Person 的实例化对象，在本次调用中，Person内部 this 指向变量 p
*/
let p = new Person('张山')
判断构造函数是否合理
解决构造函数的不合理prototype__proto__对象访问机制解决构造函数的不合理：
属性直接写在 构造函数体内
方法写在 构造函数的 prototype 上
function Person(name,age){
// 将属性写在构造函数体内
this.name = name
this.age = age
}
// 将方法写在 prototype 上
Person.prototype.sayHi=function(){
console.log('hello')
}
了解构造函数中的 this指向
ES6 类语法定义构造函数class 关键字定义构造函数，定义后就是一个类，将不能当作普通函数使用，只能通过 new 得到一个对象class 类名{
// 构造器
constructor(形参){
// 书写属性
this.属性名=属性值
}
// 在原型上书写一个方法
函数名(形参){ 执行代码 }
}
【Javascript——面向对象】 小例子：class Person{
constructor(name,age){
// 定义书写属性，this指向实例化对象
this.name=name,
this.age=age
// 调用方法
this.init()
}
init(){
console.log(this)
}
}
let o=new Person('Jack',18)
// 通过实例进行调用方法
o.init()
console.log(o)
推荐阅读
