JS-手写new

news2025/4/7 9:19:45

我们先再来理一理原型

Object1 = {
    name:'deng',
    age:18
}
Object2 ={
    name:'ru',
    age:18
}
const Person = function(){

}
Person.prototype = Object1;
const p1 = new Person();
console.log(p1.name); //deng
Person.prototype = null;
console.log(p1.name); //deng

上面给Person的构造函数绑定了一个原型,接着new了他的对象。紧接着将构造函数的原型置空,这时候可以发现当构造函数的prototype改变并没有影响p1的属性

也就是说创建出的对象跟构造函数没有任何关系了,他是独立的个体,他只是继承了构造函数中的属性,他跟构造函数的原型有关系。

我们来打印一下这个对象

console.log(p1);
在这里插入图片描述

对象通过__proto__属性来找到原型。但是对象本身是没有这个属性的,我们可以看看
这个对象是一个空对象(浅色标记不是真实属性,控制台为了方便你查看这个继承关系,会将 Prototype 属性显示出来。)之前文章讲过:

proto ,绝大部分浏览器都支持这个非标准的方法访问原型,然而它并不存在于 Person.prototype 中,实际上,它是来自于 Object.prototype ,与其说是一个属性,不如说是一个 getter/setter,当使用 obj.proto 时,可以理解成返回了 Object.getPrototypeOf(obj)。

可以看到它显示的是Person的实例对象,他是怎么找到它的构造函数的呢?难道是通过他的原型对象的construcor找到的?我们尝试修改他的__proto__属性。

p1.__proto__ = Object2;
重新打印他,发现仍是Person
在这里插入图片描述

实际上 JavaScript 对象有隐式属性如 [[Constructor]][[Prototype]][[Scopes]][[IsArray]] 等,都是 JavaScript 引擎在幕后管理的,通常不直接暴露给开发者,但它们对对象的行为、继承、作用域管理等有着重要的作用。

  • person1.constructor 返回的是 Person.prototype.constructor,它是指向 Person 函数的。
  • [[Constructor]] 是 JavaScript 引擎内部的隐式属性,它实际上不会暴露出来,所以我们无法直接访问。

person1.constructor 访问的是原型链上的 constructor 属性,而不是内部的 [[Constructor]] 隐式属性。

当我们想要创建一个对象时,会发生以下几个过程
一:构造函数创建过程:创建一个对象,让他来充当函数的原型对象。
二:对象创建过程:

  1. 创建一个空对象
  2. 将新对象的__proto__ 属性指向构造函数的 prototype 属性。
  3. 执行构造函数中的代码,将 this 绑定到新对象,并为它添加属性。
  4. 如果构造函数没有显式返回对象,new 表达式会返回新创建的对象。

接下来我们来手写这个过程

myNew(Person,'deng',18);
function myNew(){
let obj = {};
let con = [].shift.call(arguments);
obj.this = con;
const res = con.apply(obj,arguments);
return res instanceof Object ? res : obj;
}`

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2260542.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

深圳国威HB1910数字IP程控交换机 generate.php 远程命令执行漏洞复现

0x01 产品描述: 深圳国威主营国威模拟、数字、IP 交换机、语音网关、IP 电话机及各种电话机。深圳国威电子有限公司HB1910是一款功能强大的网络通信设备,适用于各种企业通信需求。 0x02 漏洞描述: 深圳国威电子有限公司HB1910数字IP程控交换机generate.php存在远程命令执行…

机器学习预处理-表格数据的分析与可视化

机器学习预处理-表格数据的分析与可视化 最近在做一些模型部署的工作,但是发现对于数据的处理、分析、训练方面还是缺少一些系统的学习,因此抽空余时间分析总结一些使用python进行数据处理的实用案例,希望能够方便自己已经其他人的Ctrl CV。…

鸿蒙项目云捐助第六讲鸿蒙App应用的首页导航资讯功能的实现

鸿蒙项目云捐助第六讲鸿蒙App应用的首页导航资讯功能的实现 前面的教程中已实现了启动页,登录页,注册页及首页的部分功能。这里有一些朋友提出问题,如何设置登录页面的背景图片。这里稍带说一个这个功能的实现。 一、登录页面的背景图片实现…

【Vue3】前端使用 FFmpeg.wasm 完成用户视频录制,并对视频进行压缩处理

强烈推荐这篇博客!非常全面的一篇文章,本文是对该博客的简要概括和补充,在不同技术栈中提供一种可行思路,可先阅读该篇文章再阅读本篇: FFmpeg——在Vue项目中使用FFmpeg(安装、配置、使用、SharedArrayBu…

17、ConvMixer模型原理及其PyTorch逐行实现

文章目录 1. 重点2. 思维导图 1. 重点 patch embedding : 将图形分割成不重叠的块作为图片样本特征depth wise point wise new conv2d : 将传统的卷积转换成通道隔离卷积和像素空间隔离两个部分,在保证精度下降不多的情况下大大减少参数量 2. 思维导图 后续再整…

金蝶云苍穹踩过的坑(慢慢更新)

IDEA不能用最新版,不然搜不到金蝶的插件。 我用的是2024.1.7/2023.1.7 IDEA里增加金蝶插件库的地址也变了,现在是 https://tool.kingdee.com/kddt/idea-updatePlugins.xml 金蝶云苍穹部署在服务器 MAC本地IDEA调试的时候,登录N次能成功一次…

springboot438校园志愿者管理系统(论文+源码)_kaic

摘 要 如今社会上各行各业,都喜欢用自己行业的专属软件工作,互联网发展到这个时候,人们已经发现离不开了互联网。新技术的产生,往往能解决一些老技术的弊端问题。因为传统校园志愿者管理系统信息管理难度大,容错率低&…

高项 - 信息系统管理

个人总结,仅供参考,欢迎加好友一起讨论 博文更新参考时间点:2024-11-09 高项 - 章节与知识点汇总:点击跳转 文章目录 高项 - 信息系统管理管理方法管理基础规划和组织设计和实施运维和服务优化和持续改进 管理要点数据管理运维管…

05、GC基础知识

JVM程序在跑起来之后,在数据的交互过程中,就会有一些数据是过期不用的,这些数据可以看做是垃圾,JVM中,这些垃圾是不用开发者管的,它自己会有一套垃圾回收系统自动回收这些内存垃圾,以备后面继续…

【前端开发】HTML+CSS网页,可以拿来当作业(免费开源)

HTML代码 <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"><meta name"viewport" content_lizhongyu"widthdevice-width, initial-scale1.0"><title>小兔鲜儿-新鲜、惠民、快捷<…

【Unity3D】无限循环列表(扩展版)

基础版&#xff1a;【Unity技术分享】UGUI之ScrollRect优化_ugui scrollrect 优化-CSDN博客 using UnityEngine; using UnityEngine.UI; using System.Collections.Generic;public delegate void OnBaseLoopListItemCallback(GameObject cell, int index); public class BaseLo…

Git-基础操作命令

目录 Git基础操作命令 case *查看提交日志 log 版本回退 get add . Git基础操作命令 我们创建并且初始化这个仓库以后&#xff0c;我们就要在里面进行操作。 Git 对于文件的增删改查存在几个状态&#xff0c;这些修改状态会随着我们执行Git的命令而发生变化。 untracked、…

Flutter Navigator2.0的原理和Web端实践

01 背景与动机 在Navigator 2.0推出之前&#xff0c;Flutter主要通过Navigator 1.0和其提供的 API&#xff08;如push(), pop(), pushNamed()等&#xff09;来管理页面路由。然而&#xff0c;Navigator 1.0存在一些局限性&#xff0c;如难以实现复杂的页面操作&#xff08;如移…

【容器】k8s学习笔记基础部分(三万字超详细)

概念 应用部署方式演变 在部署应用程序的方式上&#xff0c;主要经历了三个时代&#xff1a; 传统部署&#xff1a;互联网早期&#xff0c;会直接将应用程序部署在物理机上 优点&#xff1a;简单&#xff0c;不需要其它技术的参与 缺点&#xff1a;不能为应用程序定义资源使…

PostgreSQL 常用运维SQL整理

一、查询并杀会话 -- 查询会话 select pid,usename,client_addr,client_port,query_start,query,wait_event from pg_stat_activity; -- 杀会话 select pg_terminate_backend(pid号); -- 使用如下命令自动生成杀会话语句 select datid,datname,pid,usesysid,usename,applicat…

前端0基础用Cursor完成管理系统页面 - 1

Cursor下载 下载链接: https://www.cursor.com/ Hello World! 作为完全不会前端的人&#xff0c;首先需要让AI帮我们搭建一个HelloWorld界面 确定语言框架 首先要给AI框定好前端语言和框架&#xff0c;由于AI的物料大量来自网上的开源项目&#xff0c;所以越是受欢迎的开源…

系统组件优化的思考框架

我之前的文章里有分享过自己总结的做技术选型的思考框架&#xff0c;本文将会分享一下我总结的做系统组件调优/优化的思考框架。 组件优化的思考框架 常见的互联网架构基本离不开数据库、缓存、消息队列、搜索、数据处理等等各种组件&#xff0c;虽然组件的形态不一、功能不同…

Linux shell的七大功能 ---自动补齐、管道机制、别名

1、自动补齐---TAB 输入命令的前几个字符&#xff0c;按下tab键&#xff0c;会自动补齐完整的字符&#xff0c;若有多个命令、文件或目录的前几个字符相同&#xff0c;按下tab将会全部列举出来 2、管道机制---| 例如&#xff1a;ls -- help |more 将有关ls的帮助内容传递给“|…

计算机网络-基础概念(HTTP,TPC/IP, DNS,URL)

HTTP不同的版本 HTTP0.9于1990年问世&#xff0c;此时HTTP并没有作为正式的标准被建立。HTTP正式被公布是1996年的5月&#xff0c;版本命名为HTTP/1.0。HTTP1.1&#xff0c;1997年1月公布&#xff0c;目前仍然是主流版本的HTTP协议版本。 TCP/IP 通常使用的网络是在TCP/IP协…

12.3【JAVA-EXP4-DEBUGSTUDY】

java升级版本 JDK 1.8 是 Java Development Kit 的第 8 版本&#xff0c;发布于 2014 年 3 月 18 日。这个版本是 Java SE&#xff08;Standard Edition&#xff09;的一部分&#xff0c;包含了 Java 编程语言的实现、编译器、调试工具和其他相关组件 JDK 1.8: 这里的 1.8 表…