当前位置: 首页 > news >正文

【基础类】—原型链系统性知识

一、创建对象有几种方法

  1. 字面量创建对象
    1-1. 什么是字面量
    字面量就是所见即所,指的是常量;用来为变量赋值时的常数量
    代码例子:123;‘ABC’, {name: ‘张三’}, undefined , true
    生活例子:门店的招牌,手机号,身份证,排队号

1-2 字面量对象: 通过字面量的方式创建对象

let o1 = {name: '张三', age: 22}
// 生活例子: 一个叫张三的对象
  1. Object 方法创建对象
    2-1 Object方法将输入的参数转换为对象
    在这里插入图片描述
    ① null 和 undefined 返回空对象
    ② 数字返回数字类型的对象;字符串返回字符串类型对象;函数返回函数对象
    ③ 参数如果是对象,返回参数本身
    生活例子:Object方法类似于分类,你把任意物品给到某个人或机器,然后他会对物品分类,
    比如 给香蕉,水果:香蕉;菠菜, 蔬菜:菠菜,薯片,零食:薯片

2-2 Object 方法创建对象

let o2 = new Object({name: '菠菜'})
// 生活例子:一个名叫菠菜的对象
  1. 构造函数创建对象
    3-1 什么是构造函数
    用 new 关键字来调用的函数,称为构造函数。构造函数首字母一般大写
let M = function () {this.name ='243'
}
// 普通函数
console.log(M) 
ƒ () {this.name ='243'
}
// new M()构造函数 , 构造函数返回函数内部的对象,如果内部有定义属性,返回内部属性对象,如没有返回空对象
console.log(new M())
M {name: '243'}

3-2 用构造函数创建对象

let M = function () {this.name = '张三'
}
let o3 = new M()
o3
M {name: '张三'}
  1. Object.create创建一个新对象
    静态方法以一个现有对象作为原型,创建一个新对象
var P = {name: 'o4'}
var o4 = Object.create(P)
o4 
{}

二、原型、构造函数、实例、原型链

let M = function () {this.name = '张三'
}
let o3 = new M()

在这里插入图片描述

  1. 构造函数: 普通函数被new 使用后,就是构造函数, M就是构造函数
  2. 实例:实例是类的具象化产品,而对象是一个具有多种属性的内容结构,实例都是对象,而对象不全是实例。
  3. 构造函数可以通过 new运算符 生成一个实例,例如o3
  4. 构造函数也是函数,所有函数上都有prototype属性(函数声明时自动生成),构造函数的prototype属性指向原型对象(初始化空对象)
  5. 原型对象 的构造器 constructor 默认指向声明的构造函数,
M.prototype.constructor  === M
true
  1. 实例的__proto__属性指向原型对象,即构造函数的prototype属性
o3.__proto__===M1.prototype
true

在这里插入图片描述
7. 原型链:创建一个实例对象,通过实例对象的__proro__属性找创建实例的原型对象,一直往上找,直到找到构造函数Object的prototype属性指向的原型对象,原型链的顶点为null, 这个链条就是原型链

o5.__proto__.__proto__ === Object.prototype
true
o5.__proto__.__proto__.__proto__
// null
  1. 原型对象增加属性和方法,都可以被实例所继承,所以当多个实例有相同的方法就可以存在原型对象上
let M = function (name) {this.name = name
}
let o3 = new M()
M.prototype.say = function () {console.log('你好')
}
o3.say()
// 你好
  1. 构造函数的__proto__属性 等于 函数的原型对象
M.__proto__ === Function.prototype

三、instanceof的原理

instanceof : 运算符用于检测构造函数的 prototype 属性是否出现在某个实例对象的原型链上

// o3 是 M构造函数的一个实例
o3 instanceof M 
true
// o3 是原型链上构造函数的实例
o3 instanceof Object
true
// M的原型对象的__proto__ === Object的原型对象
M.prototype.__proto__ === Object.prototype
true// o3的__proto__的构造器 === M,表示o3由M构造函数直接生成
o3.__proto__.constructor === M
true
// o3的__proto__的构造器 不等于Object,表示o3不是由Object 构造函数直接生成
o3.__proto__.constructor === Object
false

四、new运算符

new 运算符的工作原理:

let M = function (name) {this.name = name
}
let o3 = new M()
  1. new 的第一个步骤,一个新对象被创建
  2. 新对象继承构造函数的原型对象, var o3 = new M(), o3 继承 M.prototype 上的方法和属性
  3. 构造函数M被执行。 执行的时候,相应的参数会被传入,同时上下文(this)会被指定为这个新实例
    PS:当构造函数不传递参数时, new M 等同于 new M()
  4. 如果构造函数返回了一个对象,那么这个对象会取代整个new出来的结果。如果构造函数没有返回对象,那么new出来的结果为步骤1创建的对象(空对象)
var new2 = function (func) {// 步骤1和2var o =Object.create(func.prototype)// 步骤3 var k = func.call(o)// 步骤4if (typeof k === 'object') {return k} else {return o}
}o6 = new2(M)
M {name: '张三'}
o6 instanceof M
true
o6 instanceof Object
true
o6.__proto__.constructor === M
true
http://www.lryc.cn/news/119519.html

相关文章:

  • ddia(3)----Chapter3. Storage and Retrieval
  • SpringBoot自定义拦截器interceptor使用详解
  • AI抠图使用指南:Stable Diffusion WebUI Rembg实用技巧
  • gitlab-Runner搭建
  • 【ChatGPT 指令大全】销售怎么借力ChatGPT提高效率
  • 计算机网络 网络层 路由 路由信息协议RIP
  • 【Spring】-Spring项目的创建
  • SQL | 使用通配符进行过滤
  • make: *** [Makefile:719: ext/openssl/openssl.lo] Error 1
  • Android Studio实现简单ListView
  • 【设计模式】模板模式
  • 配置docker和复现
  • Qt应用开发(基础篇)——工具箱 QToolBox
  • 地理测绘基础知识(1) 坐标系经纬度与ECEF直角坐标的基本换算
  • 【UE4 RTS】08-Setting up Game Clock
  • 百度chatgpt内测版
  • [GAN] 使用GAN网络进行图片生成的“调参人”入门指南——生成向日葵图片
  • (十)人工智能应用--深度学习原理与实战--模型的保存与加载使用
  • Java“牵手”1688商品详情页面数据获取方法,1688API实现批量商品数据抓取示例
  • Docker_docker runContainerd
  • python中常见的矩阵变换总结
  • LightningChart JS 2023Crack,CPU高效实时更新
  • hutool 导出复杂表头excel
  • git和github学习
  • 竞赛项目 车位识别车道线检测 - python opencv
  • 中文版开源Llama 2同时有了语言、多模态大模型,完全可商用
  • JavaScript、TypeScript、ES5、ES6之间的联系和区别
  • RCNA——单臂路由
  • leetcode做题笔记69
  • CentOS根分区扩容实战(非LVM)!