js中的new file_JS中的new操作符

一、什么是new?

众所周知,在JS中,new的作用是通过构造函数来创建一个实例对象。

像下面这样:(和普通函数不一样,当函数用作 构造函数 时,首字母一般要大写,以作区分。)

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

二、new经历了什么过程?

Foo明明只是一个函数,可是为什么new Foo()执行后会突然返回一个对象呢?

我们从结果出发可以推断出,既然返回了一个对象,那么这事肯定和 对象 有关系。

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

  1. 帮我们创建了一个空对象,例如:obj;
  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);
c95d834439eb19aebf12e4fb0bfafa6c.png

分析:

首先预编译,声明提升,解释执行。

执行时按照顺序来进行,

  • obj指向空对象;
  • obj的原型地址指向构造函数Foo的原型对象;
  • 执行 Foo.call(obj, 'mm');this.name = name; 通过函数的 call方法 将this绑定到obj(也就是说this就是obj),实参mm传入构造函数Foo中,这样this.name = ‘mm’,那么obj.name = ‘mm’,也就是说name属性被挂载到obj对象上。return this; 就是return obj,这样obj这个对象就被返回出来了。
  • 将结果赋值给变量foo。
  • 打印结果。

四、总结

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

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

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

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

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

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

相关文章

css不继承父类样式_提升你的Python编程能力,细说类的继承,拿走不谢

今天咱们聊点啥呢?要不还是聊点Python基础的东东吧,大家已经都知道啦,Python呢是一种面向对象的脚本编程语言,那面向对象的编程语言呢,都会支持面向对象的三大特性,你知道是哪三大特性吗?当然是…

R 回归 虚拟变量na_【R语言进阶】Logistic回归及哑变量设置

点击上方“蓝字”,我们一起分析数据Logistic回归是最常用的多因素回归模型,在医学研究中,常用于研究疾病的危险因素,下面我们一起来看看,R语言是如何实现Logistic回归的。1第一步 导入数据首先,在excel里全选数据集,右键复制。然后&#xff0…

logisticregression参数_通俗地说逻辑回归【Logistic regression】算法(二)sklearn逻辑回归实战...

前情提要:通俗地说逻辑回归【Logistic regression】算法(一) 逻辑回归模型原理介绍上一篇主要介绍了逻辑回归中,相对理论化的知识,这次主要是对上篇做一点点补充,以及介绍sklearn 逻辑回归模型的参数&#…

tensorflow适用于python版本_tensorflow用python哪个版本更好?

tensorflow用python哪个版本?一、安装anaconda tensorflow是基于python脚本语言的,因此需要安装python, 当然还需要安装numpy、scipy、six、matplotlib等几十个扩展包。如果一个个安装,装到啥时候去?(我曾经光安装scip…

php parse url ctf,【SSRF】如何绕过filter_var(), preg_match() 和 parse_url()

0x01 前言这篇文章是在我看完一片国外安全大佬写的文章后对其进行总结并翻译得到的。0x02 正文之绕过filter_var和preg_match本片文章主要深入一种php ssrf的技术——如何绕过例如filter_var(), preg_match()和parse_url()等函数。本次我进行测试的php版本全部为php v5.6.30php…

python json解析_python读取json文件并解析

原博文 2018-07-09 18:35 − # -*- coding: utf-8 -*- import os import json import sys reload(sys) sys.setdefaultencoding(utf-8) filelistos.listdir(E:\\log\\files\\) for ite... 相关推荐 2019-12-05 20:03 − 如何使用 Python 语言来编码和解码 JSON 对象。 JSON(Jav…

python中文词云图代码_Python简单实现词云图代码及步骤解析

一、安装 wordcloud pip install wordcloud 二、加载包、设置路径 import os from wordcloud import WordCloud import matplotlib.pyplot as plt os.chdir(E:\\pyspace\\tmp) 三、词云图示例 1、默认参数示例 text Keep it simple and stupid. wc WordCloud() # 实例化词云图…

usb大容量存储设备驱动程序_20年历史了!为什么USB接口还存在?网友:原来如此...

USB接口作为计算机领域应用最广泛的数据接口,已有20多年的历史。和它的名字一样,USB(Universal Serial Bus)最初也是为统一的数据接口而设计的。你几乎可以用它来代替计算机的各种外部数据接口,只需为它设计相应的驱动程序。随着市场对USB接口…

linux终端炫酷命令,你不得不知道11个炫酷的 Linux 终端命令

很多朋友都很喜欢Linux ,Linux是一套免费使用和自由传播的类Unix操作系统,是一个基于POSIX和UNIX的多用户、多任务、支持多线程和多CPU的操作系统,Linux是一款免费的操作系统,用户可以通过网络或其他途径免费获得,并可…

lasso回归_一文读懂线性回归、岭回归和Lasso回归

(图片由AI科技大本营付费下载自视觉中国)作者 | 文杰编辑 | yuquanle本文介绍线性回归模型,从梯度下降和最小二乘的角度来求解线性回归问题,以概率的方式解释了线性回归为什么采用平方损失,然后介绍了线性回归中常用的两种范数来解决过拟合和…

springcloud架构特点_打造企业级微服务平台架构,分布式应用场景管理

微服务平台架构是一项在云中部署应用和服务的新技术。大部分围绕微服务的争论都集中在容器或其他技术是否能很好的实施微服务。微服务系统可以在“自己的程序”中运行,并通过“轻量级设备与HTTP型API进行沟通”。关键在于该服务可以在自己的程序中运行。通过这一点我…

怎么判断一个字符串的最长回文子串是否在头尾_LeetCode 5 迅速判断回文串的Manacher算法...

本文始发于个人公众号: TechFlow题意Given a string s, find the longest palindromic substring in s. You may assume that the maximum length of s is 1000.Link: https://leetcode.com/problems/longest-palindromic-substring/翻译给定一个字符串s&#xff0c…

spring和mybatis结合做简单的增删查改系统_springbootamp;amp;vue简单的景点信息管理系统...

springboot&&vue简单的景点信息管理系统这两天闲着没有什么事,就根据陈哥的教程,试着写了一个springboot和vue的简单的景点信息管理系统。也就大致实现了最基本的增删查改。先看看效果图吧:1、登陆界面: 2、注册界面&…

spark算子_十、Spark之详解Action类算子

常用Action类算子列表reduce(func): 通过func函数来对RDD中所有元素进行聚合运算,先运算分区内数据,再运算分区间数据。scala> val rdd1 sc.makeRDD(1 to 100)rdd1: org.apache.spark.rdd.RDD[Int] ParallelCollectionRDD[4] at makeRDD at :24# 对…

await原理 js_「速围」Node.js V14.3.0 发布支持顶级 Await 和 REPL 增强功能

本周,Nodejs v14.3.0 发布。这个版本包括添加顶级 Await、REPL 增强等功能。REPL 增强通过自动补全改进对 REPL 的预览支持,例如,下图中当输入 process.ver 之后,不需要输入剩下的实际内容,它帮我们生成了自动补全的输…

linux输入ls后不显示_零基础学习之Linux基础命令小结

安装完重启后,没有像sery所说在图形界面崩溃了,由于我没有安装X-WINDOWS而是直接进入了文本界面。如果你想做linux管理的话,最好在文本界面下工作,这样会适应如下图:第一行显示的是我们所安装的linux是Red Hat 企业4第二行显示的是…

.gitignore文件_【第1739期】为Git仓库里的.idea文件夹正名

前言.idea该不该提交到代码仓库中呢?你的意见呢?今日早读文章由《Flask Web开发》作者李辉分享。正文从这开始~~在网络上,我曾多次看到人们对于Git仓库中的.idea文件夹的偏见。最近的一次是在某个博客中技术专家对于志…

监控linux时间不对,shell 计算故障时间 配合web监控

#!/bin/bash#checkfail.log 为SHELL监控网站时间存放的日志文件 https://blog.51cto.com/junhai/2437965fail_time(){starttimetail -n 1000 checkfail.log |grep "$url"|grep "第1次"|tail -n 3|head -n 1|awk {print $1, $2} #取网站挂掉的时间endtimet…

linux redis清空数据恢复,Redis数据恢复--误删数据后一次吓尿的经历

1、起因,一个flushdb命令因为误操作,输入了一个flushdb命令,导到redis里0号库里的数据全部清空,OMG,这里有不少重要信息,如果被领导知道,必开除2、appendonly留有生机仔细想想,当时数…

c语言 枚举类型 uint32_浅谈C语言枚举类型 | 附自创用法分享

经济学家说过,路边是不会有100元的;但如果有,你还是要捡起来。同理,在貌似万物免费的网络时代,你是很难找到有针对性的好资料;但是如果有,希望你能认真学习吸收。比如笔者今天写的这一篇一今天这…