JS中的new操作符

文章目录

  • JS中的new操作符
    • 一、什么是new?
    • 二、new经历了什么过程?
    • 三、new的过程分析
    • 四、总结

JS中的new操作符

参考:https://www.cnblogs.com/buildnewhomeland/p/12797537.html

一、什么是new?

在JS中,new的作用是通过构造函数来创建一个实例对象
和普通函数不一样,当函数用作构造函数时,首字母一般要大写,以作区分。

function Foo(name) {this.name = name;
}
console.log("new Foo('mm')的类型:", typeof new Foo('mm')); // object
console.log("Foo的类型:", typeof Foo);                     // function

二、new经历了什么过程?

Foo明明只是一个函数,可是为什么new Foo()执行后会突然返回一个对象呢?
我们从结果出发可以推断出,既然返回了一个对象,那么这事肯定和对象有关系。

实际上new帮我们做了这样几件事:

1.帮我们创建了一个空对象;
2.将空对象原型的内存地址__proto__指向函数的原型对象;(这里涉及到了原型链的知识)
3.利用函数的`call`方法,将原本指向`window`的绑定对象this指向了obj。(这样一来,当我们向函数中再传递实参时,对象的属性就会被挂载到obj上。)
4.利用函数返回对象obj。

三、new的过程分析

function Foo(name) {this.name = name;return this;
}
var obj = {};
obj.__proto__ = Foo.prototype;
// Foo.call(obj, 'mm');
var foo = Foo.call(obj, 'mm');
console.log(foo);

在这里插入图片描述

分析:
1.预编译,声明提升,解释执行。
2.执行时按照顺序来进行,
3.obj指向空对象;
4.obj的原型地址指向构造函数Foo的原型对象;
5.执行Foo.call(obj, 'mm');
6.this.name = name; 通过函数的call方法将this绑定到obj(也就是说this就是obj),实参mm传入构造函数Foo中,这样this.name = 'mm',那么obj.name = 'mm',也就是说name属性被挂载到obj对象上。
7.return this; 就是return obj,这样obj这个对象就被返回出来了。
8.将结果赋值给变量foo。
9.打印结果。

在这里插入图片描述

四、总结

第三部分的代码直接用new 构造函数效果是相同的。

function Foo(name) {this.name = name;
}
var foo = new Foo('mm');
console.log(foo);

简而言之,new操作符帮我们做了四件事:

  1. 创建空对象;
  2. 空对象的原型指针指向构造函数的原型对象;
  3. 利用函数的call方法改变this指向,在空对象上挂载属性或方法;
  4. 返回对象。

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

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

相关文章

pytest parametrize多参数接口请求及展示中文响应数据

编写登陆接口 app.py from flask import Flask, request, jsonify, Responseapp Flask(__name__)app.route(/login, methods[POST]) def login():username request.form.get(username)password request.form.get(password)# 在这里编写你的登录验证逻辑if username admin…

量化策略分类:中低频超高频

指数增强策略(AlphaBeta) 在跟踪标的指数的基础上,用量化投资的方法,适当调整持仓范围,追求获得超越标的指数的收益。 量化选股策略(AlphaBeta) 通过量化因子,选择股票多头持仓&a…

React笔记(八)Redux

一、安装和配置 React 官方并没有提供对应的状态机插件,因此,我们需要下载第三方的状态机插件 —— Redux。 1、下载Redux 在终端中定位到项目根目录,然后执行以下命令下载 Redux npm i redux 2、创建配置文件 在 React 中,…

FreeRTOS的信号量和互斥量之间的区别和联系

文章目录 信号量信号量简介信号量特征 互斥量互斥量的上锁机制互斥量的优先级继承机制 二值信号量和互斥量的作用二值信号量的作用互斥量的作用 二值信号量和互斥锁关系相同点不同点 如何根据场景选择回答信号量和互斥锁之间的区别: 信号量 信号量简介 队列(queue)…

LeetCode 面试题 02.06. 回文链表

文章目录 一、题目二、C# 题解 一、题目 编写一个函数,检查输入的链表是否是回文的。 点击此处跳转题目。 示例 1: 输入: 1->2 输出: false 示例 2: 输入: 1->2->2->1 输出: true …

大集合按照指定长度进行分割成多个小集合,用于批量多次处理数据

📚目录 拆分案例拆分的核心代码 通常我们对集合的更新或者保存都需要用集合来承载通过插入的效率,但是这个会遇到一个问题就是你不知道那天那个集合的数量可能就超了,虽然我们连接数据库进行批量提交会在配置上配置allowMultiQueriestrue,但是…

(一)连续随机量的生成-接受拒绝重采样

连续随机量的生成-接受拒绝重采样 1. 接受-拒绝重采样方法2. Python编程实现 1. 接受-拒绝重采样方法 重采样方法由两个步骤组成,第一个步骤提供近似分布的随机量,第二个步骤是校正机制。 在下文中,我们用 f f f 表示目标分布,用…

【每日一题】823. 带因子的二叉树

【每日一题】823. 带因子的二叉树 823. 带因子的二叉树题目描述解题思路 823. 带因子的二叉树 题目描述 给出一个含有不重复整数元素的数组 arr ,每个整数 arr[i] 均大于 1。 用这些整数来构建二叉树,每个整数可以使用任意次数。其中:每个…

类和对象(下)

💓博主个人主页:不是笨小孩👀 ⏩专栏分类:数据结构与算法👀 C👀 刷题专栏👀 C语言👀 🚚代码仓库:笨小孩的代码库👀 ⏩社区:不是笨小孩👀 🌹欢迎大…

大模型综述论文笔记1-5

目录 KeywordsIntroductionSLMNLMPLMLLM Backgroud for LLMsScaling Laws for LLMsKM scaling lawChinchilla scaling law Emergent Abilities of LLMsIn-context learningInstruction followingStep-by-step reasoning Key Techniques for LLMsScalingTrainingAbility eliciti…

【uniapp】 实现公共弹窗的封装以及调用

图例&#xff1a;红框区域为 “ 内容区域 ” 一、组件 <!-- 弹窗组件 --> <template> <view class"add_popup" v-if"person.isShowPopup"><view class"popup_cont" :style"{width:props.width&&props.width&…

mybatis源码学习-1-调试环境

写在前面,这里会有很多借鉴的内容,有以下三个原因 本博客只是作为本人学习记录并用以分享,并不是专业的技术型博客笔者是位刚刚开始尝试阅读源码的人,对源码的阅读流程乃至整体架构并不熟悉,观看他人博客可以帮助我快速入门如果只是笔者自己观看,难免会有很多弄不懂乃至理解错误…

Spring源码解析-总览

1、前言 Spring源码一直贯穿我们Java的开发中&#xff0c;只要你是一个Java开发人员就一定知道Spring全家桶。Spring全家桶为我们一共一站式服务&#xff0c;IOC、AOP更是Spring显著特性。但是Spring到底怎么为我们提供容器&#xff0c;管理资源的呢&#xff1f;下来&#xff0…

MyBatis 中如何实现分页 ?

1. MyBatis 中如何实现分页 &#xff1f; MyBatis 中的分页有两种实现方式&#xff1a;物理分页 or 逻辑分页 【物理分页】 1.1 原生 SQL 物理分页 物理分页是通过 SQL 查询语句&#xff0c;LIMIT 语法进行分页的&#xff0c;它是在数据库引擎层面实现的。 <select id&…

Ubuntu学习---跟着绍发学linux课程记录(第二部分)

文章目录 7 文件权限7.1 文件的权限7.2 修改文件权限7.3 修改文件的属主 8、可执行脚本8.2Shell脚本8.3python脚本的创建 9Shell9.1Shell中的变量9.2 环境变量9.3用户环境变量 学习链接: Ubuntu 21.04乌班图 Linux使用教程_60集Linux课程 所有资料在 http://afanihao.cn/java …

学生管理系统VueAjax版本

学生管理系统VueAjax版本 使用Vue和Ajax对原有学生管理系统进行优化 1.准备工作 创建AjaxResult类&#xff0c;对Ajax回传的信息封装在对象中 package com.grg.Result;/*** Author Grg* Date 2023/8/30 8:51* PackageName:com.grg.Result* ClassName: AjaxResult* Descript…

Docker进入容器出现bash: vi: command not found

&#x1f388;1 参考文档 docker基础容器中bash: vi: command not found问题解决 | 你邻座的怪同学 &#x1f50d;2 问题描述 在使用 Docker 容器时&#xff0c;有时候里边没有安装vim&#xff0c;敲vim命令时提示说&#xff1a;vim: command not found。 这个时候就需要安装v…

Java抛出异常

当某个方法抛出了异常时&#xff0c;如果当前方法没有捕获异常&#xff0c;异常就会被抛到上层调用方法&#xff0c;直到遇到某个try ... catch被捕获为止 调用printStackTrace()可以打印异常的传播栈&#xff0c;对于调试非常有用&#xff1b;捕获异常并再次抛出新的异常时&am…

项目-IM

tim-server tim-server启动类实现CommandLineRunner接口&#xff0c;重写run()方法 run()方法开启一个线程&#xff0c;创建zk持久父节点&#xff0c;创建临时顺序子节点&#xff0c;将netty-server信息写入 1.1 用户登录 1.2 gateway向认证授权中心请求token 1.3 从zookee…

在windows上安装Cmake软件

Cmake是一个跨语言、跨平台、开源的编译工具&#xff0c;可以编译C、C、Note.js、JavaScript、C#、Java、Python、Php、Object-C、Ruby等工程&#xff0c;需要设置对应的src源码目录、ext第三方依赖目录、CMakeList.txt构建列表&#xff0c;再使用cmake命令即可。     2023年…