我的账户
猩码学苑

专注C++开发菁英教育

亲爱的游客,欢迎!

已有账号,请

如尚未注册?

前端-王卓凡-20230525

[复制链接]
王卓凡 发表于 2023-6-13 18:12:24 | 显示全部楼层 |阅读模式 打印 上一主题 下一主题
实例对象和构造函数原型对象的关系
实例之所有能够访问构造函数原型对象上的方法,是因为
我们的实例对象也有一个属性:__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)



回复

使用道具 举报

关注0

粉丝0

帖子47

发布主题
大家都在学
课堂讨论
一周热帖排行最近7x24小时热帖
关注我们
专注C++菁英教育

客服电话:18009298968

客服时间:9:00-21:00

猩码学苑 - 专注C++开发菁英教育!( 陕ICP备2025058934号-1 )

版权所有 © 陕西菁英数字科技有限公司 2023-2026