1.原型继承
1.面向对象:是一种注重结果的思维方式
2.面向对象三大特征:
(1)封装:将代码放入对象的方法中
(2)继承:一个对象拥有另一个对象的所有的成员
(3)多态:一个对象在不同情况下的状态
3. 继承:一个对象(子)拥有另一个对象(父)所有的成员
原型继承:把父对象作为子对象构造函数的原型
2.原型链
2.1 原型链:每一个实例对象都有自己的原型,原型也是对象,也有自己的原型。
以此类推,形成链式结构,称之为原型链
2.2 对象访问原型链规则:就近原则
*对象先访问自己的成员,自己没有找到原型,原型也没有找到原型的原型,以此类推,直到原型链终点(null),如果还是找不到,
属性则获取undefined,方法则报错
// 1,构造函数
function Person(name,age){
this.name=name
this.age=age
}
// 2.原型:存储所有实例对象共有的成员
Person.prototype.type='哺乳动物'
Person.prototype.eat=function(){
console.log('吃东西')
}
// 3.实例对象
let p1=new Person('lin',20)
console.log(p1)
console.log(p1.name) //lin
console.log(p1.type) //哺乳动物
console.log(p1.hobby) //undefined
p1.eat() //吃东西
// p1.learn() //报错,p1.learn is not a function,()里面报错
p1.toString() //不报错 原因:p1的原型的原型有toString
// 查看p1.原型的原型
console.log(p1.__proto__.__proto__.constructor) //Object
console.log(p1.__proto__.__proto__===Object.prototype) //true
console.log(p1.__proto__.__proto__.__proto__) //null
2.3 经典面试题:
2.3.1 原型链作用:继承
2.3.2 js如何实现面向对象的继承:原型链
// 查看内置对象原型链
let arr=[10,20,30]
console.log(arr)
//(1) 查看arr原型
console.log(arr.__proto__.constructor)//Array
console.log(arr.__proto__===Array.prototype)//true
// (2)查看arr原型的原型
console.log(arr.__proto__.__proto__.constructor)//Object
console.log(arr.__proto__.__proto__===Object.prototype)//true
3.undefined与null的区别(面试题)
undefined 未定义(没有值)
null 空值
// 相同点:(1)值相同 (2)转布尔类型都是false
console.log(undefined==null)//true
console.log(Boolean(undefined))//false
console.log(Boolean(null))//false
// 不同点:(1)数据类型不同 (2)转number类型不同
console.log(undefined===null)//flase
console.log(Boolean(undefined))//false
console.log(Number(undefined))//NaN
console.log(Boolean(null))//0
4.instanceof运算符原理
1.instanceof运算符:检测构造函数prototype在不在实例对象的原型链中实例对象 instanceof 构造函数
* 面试题:检测 右边构造函数原型在不在左边实例对象的原型链中
2.instanceof 应用:限制函数参数的数据类型
例如:有一个函数,参数必须是数组,如果不是就报错
// arr -> Array.prototype -> Object.prototype ->null
let arr=[10,20,30]
console.log(arr instanceof Array)//true
console.log(arr instanceof Object)//true
console.log(arr instanceof String)//false
5.arguments关键字
1.arguments:获取函数所有的实参
*arguments是一个伪数组
2.arguments应用:用于实参数量 不确定的函数
举例:有些函数,例如:Math.max() arr.push() 的实参数量不一致,内部就可以使用arguments获取所有实参
6.剩余参数(rest参数)
剩余参数(rest参数):获取参数剩下的所有的参数
3.1语法:...形参名
3.2 rest参数是真数组
3.3 注意点:剩余参数必须写在最后一个形参的位置
剩余参数在一般情况下,可以替代arguments 【fn(...b)】
function fn(a,...b){
console.log(a)
console.log(b)
console.log(arguments)
}
fn(10)
fn(1,2,3,4,5)
7.for-in与for-of区别(面试题)
for-in循环与for-of循环三个区别
(1)功能不同:
for-in:遍历 下标+元素
for-of:遍历元素
(2)原型不同:
for-in:可以遍历原型中的属性
for-of:不可以遍历原型中的属性
(3)数据类型不同:
for-in:可以遍历 数组+对象
for-of:只能遍历数组
总结: 如果想要下标和元素就用for-in, 只想要元素就用for-of
let arr=[10,20,30]
console.log(arr)
// 给数组原型添加属性
Array.prototype.age=66
let obj={
name:'张三',
age:20,
sex:'男'
}
// 1.for-in循环
for(let key in arr){
console.log(key)//下标
console.log(arr[key])//元素
}
// 2.for-of循环
for(let item of arr){
console.log(item)//元素
}