菁英数字科技（猩码）-猩码学苑-专注软件开发人才菁英教育

标题: 前端-王卓凡-20230525 [打印本页]

作者: 王卓凡 时间: 2023-6-13 18:12
标题: 前端-王卓凡-20230525
实例对象和构造函数原型对象的关系

实例之所有能够访问构造函数原型对象上的方法，是因为
我们的实例对象也有一个属性：__proto__,它指向了构造函数的原型对象，它是一个非标准。
这里我们就会存在一个方法的查找规则：
1.优先实例查找本身的，如果有，直接使用
2.如果实例没有这个方法，就去构造函数的原型对象上查找

console.log(u1.__proto__ === User.prototype) //true

构造器

constructor 主要用于记录该对象引用于哪个构造函数。
它可以让原型对象重新指向原来的构造函数。

function User(uname, uage) {
this.uname = uname
this.uage = uage
}
let u1 = new User('zs', 12)

console.log(User.prototype)
console.log(u1.__proto__)

console.log(User.prototype.constructor) //User
console.log(u1.__proto__.constructor) //User
function User(uname, uage) {
this.uname = uname
this.uage = uage
}
// 实现多个方法的添加
User.prototype = {
// 使用constructor属性改变原型对象的指向
constructor: User,
show: function () {
console.log(this.uname + " " + this.uage)
},
sayName: function () {
console.log('我的名字叫做：' + this.uname)
}
}
let u1 = new User('zs', 12)

console.log(User.prototype.constructor) //User
console.log(u1.__proto__.constructor) //User
原型对象和构造函数关系

原型对象的 constructor 是构造函数。
构造函数的 prototype 是原型对象。

console.log(u1.__proto__.constructor) //User
console.log(User.prototype.constructor) //User
console.log(u1.__proto__.constructor === User.prototype.constructor) //true
原型链console.log(u1.__proto__)
console.log(User.prototype.__proto__) //Object
console.log(User.prototype.__proto__ === Object.prototype) //true

console.log(User.prototype.__proto__.__proto__) //null
console.log(Object.prototype.__proto__) //null

当访问对象的某个方法或者属性时，先在自己的构造函数中寻找，如果没有，就在自己的原型中寻找，如果还是没有，就找原型的原型，一直找到object的原型，这样形成了一条链称之为原型链

JS成员查找机制

按照原型链的顺序，一级一级查找，直到找到或者没有为之，没有结果就是undefined .
就近原则。

// toString()方法
console.log(u1) //本身没有这个方法
console.log(User.prototype) // 构造函数原型也没有这个方法
console.log(Object.prototype) // Object的原型有这个方法
console.log(u1.toString()) //可以使用这个方法构造函数中thisfunction User(uname, uage) {
this.uname = uname
this.uage = uage
}

let that;
User.prototype.eat = function () {
that = this
console.log(that)
}

let u1 = new User('zs', 12)
u1.eat()
console.log(u1 === that) //true
扩展内置对象// 为数组扩展一个能分别求出奇数和偶数和的方法
Array.prototype.getAdd = function () {
  var even = 0
  var odd = 0
  for (var i = 0; i < this.length; i++) {
if (this % 2 == 0) {
   even += this
} else {
   odd += this
}
  }
  return {
even,
odd
  }
}
var arr = [1, 2, 3, 4, 5, 6, 7]
var res = arr.getAdd()
console.log(res)
call()let uname = 'zs'
let obj = {
uname: '张三'
}

function fn(a, b) {
console.log(a + b)
console.log('fn执行了')
console.log(this)
console.log(this.uname)
}
fn(1, 2)
fn.call(obj, 'hello', 'world')applylet uname = 'zs'
let obj = {
id: 1,
uname: 'james'
}
function fn(a, b) {
console.log(this)
console.log(a)
console.log(b)
console.log(this.uname)
}
// fn()
fn.apply(obj, ['h', 'e'])// 求一个数组的最大值
var arr = [12, 34, 10, 40, 90, 30]
var res = Math.max.apply(Math, arr)

//或者
var res = Math.max(...arr)
console.log(res)

欢迎光临菁英数字科技（猩码）-猩码学苑-专注软件开发人才菁英教育 (http://www.xingmaxueyuan.com/) Powered by Discuz! X3.4