JavaScript面向对象（下）

Yannick_H

已于 2022-07-19 22:36:31 修改

阅读量753

点赞数

分类专栏： Y-Y滴前端日志基本概念（笔记）文章标签： javascript 原型模式开发语言

于 2022-07-19 22:36:15 首次发布

本文链接：https://blog.csdn.net/yannick_h/article/details/125228944

版权

Y-Y滴前端日志同时被 2 个专栏收录

33 篇文章 1 订阅

订阅专栏

基本概念（笔记）

31 篇文章 0 订阅

订阅专栏

3.objec对象的__proto__属性是null

四、this指针的指向

1.构造函数内部的this指向新创建的对象（当前对象）

2.直接通过函数名调用函数时，this指向全局对象window

3.若将函数作为对象的方法调用，this指向该对象

七、JavaScript代码错误处理（异常处理）

1.ES6的继承：是单一继承（一个类的直接父类只能有一个）

2.ES5的继承：通过原型对象实现（将父类的实例对象赋给子类的原型对象）

3.在原型链继承中实现方法的覆盖（Override）

实现方法：在子类的原型对象上添加和父类安全同名的方法

4.在继承过程中确定原型对象和实例对象之间关系的方法

（1）instanceof运算符：判断实例对象的类型

（2）isPrototypeOf()方法：判断原型对象的类型

一、类的创建

1.ES5

class 类名{
}

2.ES6

（1）class类名

class类名{
    构造函数([参数]){
        初始化成员变量
    }
    成员方法
}

（2）类表达式

var 变量名=class{
    构造函数([参数]){
        初始化成员变量
    }
    成员方法
}

二、原型对象

1.构造函数的原型对象：通过prototype属性访问

2.对象的原型对象：通过对象的__proto__属性访问

3.访问对象的构造方法：在原型对象中有constructor属性指向对象的构造方法

（1）构造方法名.prototype.constructor

（2）对象名.constructor

function Person(){}
console.log(Person.prototype.constructor) //输出[function：Person]
var p1 = new Person()
console.log(p1.constructor) //输出[function：Person]

function Person(){} //原构造方法
var p2 = new Person()
console.log('p2:',p2.constructor) //输出[function：Person]
//给原型对象赋予一个新的对象
Person.prototype = { //原型对象的构造方法改变了
    sayHello:function(){
        console.log('Hello World')
    }
}
var p1 = new Person() //调用新的构造方法实例化一个对象p1
console.log('p1:',p1.constructor) //输出[Function: Object]

4.原型对象的原型对象：原型对象本身也是一个对象，所有它也有一个原型对象

（1）获取原型对象的原型对象：构造方法名.prototype.__proto

（2）原型对象的原型对象构造方法：.prototype.__proto.constructor

ps:

A.JavaScript中的所有类都直接或间接的继承自object

B.所有的对象都是通过构造方法生成的

三、原型链的结构特点

1.构造函数和原型对象

构造函数------（prototype）------->原型对象

原型对象------（constructor）------->构造函数

2.实例对象和原型对象

实例对象------（__proto__）------>实例对象

构造方法------（new）------>实例对象

3.objec对象的proto属性是null

function Person(){
    this.name = '张三'
}
Person.prototype.name = '李四'
var p = new Person()
console.log(p.name) //输出：张三
delete p.name //删除对象p的name成员
console.log(p.name) //在p对象的原型对象中查找name成员，输出：李四
delete Person.prototype.name //删除原型对象的name成员
console.log(p.name) //不存在，输出undefined

//给内置对象array的原型对象添加sum方法:用来求数组元素之和
Array.prototype.sum = function(){
    let sum = 0
    for(let i=0;i<this.length;i++){
        sum += this[i]
    }
    return sum
}

//声明数组
var arr = [12,25,38,75]
console.log('数组元素之和：',arr.sum())

四、this指针的指向

1.构造函数内部的this指向新创建的对象（当前对象）

Function Person(){
    this.name = ‘AA’
}
var p1 = new Person()\
var p2 = new Person()

2.直接通过函数名调用函数时，this指向全局对象window

function sayHello(){
    return this
}
var t = sayHello()

3.若将函数作为对象的方法调用，this指向该对象

function Student(n,s){
    this.name = n
    this.sex = s
    this.display = function(){
        console.log(‘姓名：’+this.name+ ‘\n性别：’+this.sex)
    }
}
var s1 = new Student(‘张飞’,‘男’)
s1.display() //通过对象名调用函数，此时

五、更改this指针的指向

1.apply方法

2.call方法

3.两个方法的区别

（1）在调用函数时，第一个参数默认是对象

（2）apply除第一个参数外，后面参数打包成数组进行传递

（3）call方法：除第一个参数外，后面的参数一个一个的传递

六、bind函数

实现提前绑定，在绑定时提前传入调用函数的参数

function method(a,b){
    console.log(this.name+a+b)
}
var name = '张三'
var test = method.bind({name:'李四'},'3','4')
test()

七、JavaScript代码错误处理（异常处理）

1.try

try{
    可能会出现错误的代码
}catch(e){  //e代表错误类型，名称可变
    捕获到错误后的处理代码
}

var o = {}
try {
    o.func() //出现错误：对象o没有func成员
    console.log('AAAAA') //不执行，因为上一条语句错误
} catch (e) {
    console.log(e) //执行：打印错误的类型及其详细信息
                   //TypeError是错误类型，o.func is not a function是错误信息
}
console.log('test') //执行：前一天语句的错误已经被try-catch捕获并处理了，不影响该语句的执行

2.throw抛出错误对象

try {
    let e1 = new Error('错误信息') //创建错误对象，error是内置的错误类
    throw e1 //抛出错误对象e1
} catch (error) { //catch捕获throw抛出的错误对象额e1，将e1赋给参数error
    console.log(error.message) //输出错误对象的信息
}

3.常见的错误类型

（1）Error：普通错误。是其他错误对象的基类（其他对象错误都是继承Error）

（2）TypeError：变量或函数的参数出现类型错误

（3）SyntaxError：语法错误

（4）RangError：数值超出有效的范围

（5）URIError：解析URI编码出错

URI：统一资源标识符（）

URL：全球资源定位器（）