JavaScript定义函数,创建函数实例时的内部原理

1、定义一个函数,JavaScript内部各做了哪些事情

定义一个函数时,JavaScript内部执行了以下步骤:

  1. 解析函数声明:
    当你定义一个函数时,JavaScript的解析器会首先解析函数声明。这意味着它会检查函数声明的语法是否正确,包括函数名、参数列表、函数体等。

  2. 创建函数对象:
    一旦函数声明被解析通过,JavaScript会在内存中创建一个函数对象。这个函数对象包含了函数的定义、参数信息、函数体以及其它与函数相关的元数据。

  3. 函数作用域和闭包:
    在函数创建的过程中,JavaScript会确定函数的作用域。这包括确定函数内部可以访问的变量和函数。如果函数内部引用了外部作用域的变量,那么这些变量会被“封闭”在函数内部,形成闭包。闭包允许函数在执行完毕后依然能够访问其定义时的词法环境。

  4. 将函数对象赋值给变量:
    如果你使用了变量来定义函数(例如 var myFunction = function() { ... };),那么JavaScript会将新创建的函数对象赋值给相应的变量。这样,你就可以通过变量来引用和调用这个函数了。

  5. 函数原型和prototype属性:
    每个函数对象都有一个prototype属性,它指向一个原型对象。这个原型对象包含了可以被函数的所有实例共享的属性和方法。当你使用new关键字创建函数的新实例时,新实例的内部[[Prototype]]链接会指向这个原型对象,从而可以访问原型上的属性和方法。

函数对象的原型对象(prototype)的默认值是一个空的Object对象。
换句话说,当你定义一个函数时,JavaScript会自动为其添加一个prototype属性,这个属性的默认值是一个空的对象(即不包含任何属性和方法的对象)。这个原型对象主要用于实现基于原型的继承和属性查找。

在JavaScript中,每个构造函数都有一个prototype属性,这个属性是一个指针,指向一个对象,该对象的用途是包含可以由特定类型的所有实例共享的属性和方法。按照惯例,这个prototype对象会包含一个名为constructor的属性,该属性是一个指向prototype属性所在函数的指针。这样,构造函数就能够识别哪些对象是其实例。

需要注意的是,虽然prototype对象的默认值是一个空对象,但你可以根据需要向其中添加属性和方法,以便在构造函数的实例中共享这些属性和方法。此外,你也可以通过修改prototype对象来修改已有实例的行为,但这通常是不推荐的,因为这可能会导致代码难以理解和维护。

下面是一个简单的例子,展示了如何查看一个函数对象的prototype属性的默认值:

function MyFunction() {// 函数体
}console.log(MyFunction.prototype); // 输出: {}

在这个例子中,MyFunction是一个空函数,我们打印出它的prototype属性,可以看到它的默认值是一个空的Object对象。

  1. 函数属性和方法:
    函数对象自身也有一些属性和方法,例如name(函数名)、length(参数个数)、callapplybind等。这些属性和方法允许你操作函数或获取函数的元数据信息。

下面是一个简单的函数定义示例:

function myFunction(arg1, arg2) {// 函数体console.log('Hello, world!');
}

在这个例子中,JavaScript会执行以下步骤:

  • 解析函数声明myFunction,检查其语法是否正确。
  • 创建一个新的函数对象,包含myFunction的定义、参数arg1arg2、函数体以及其它元数据。
  • 确定函数的作用域,并检查是否有闭包形成。
  • 将这个函数对象赋值给变量myFunction
  • 为这个函数对象创建一个prototype属性,并设置其默认的constructor属性指向函数对象本身。

最终,你可以通过myFunction变量来调用这个函数,并执行其函数体中的代码。

2、new 创建一个函数实例时,JavaScript内部做了哪些事情

当使用 new 关键字创建一个函数的实例时,JavaScript 内部执行以下步骤:

  1. 创建新对象
    JavaScript 首先会创建一个新的空对象。这个新对象将用作新创建的实例。

  2. 设置原型链
    新创建的对象的内部 [[Prototype]] 链接(这不是一个真正的属性,而是一个内部链接)会被设置为构造函数的 prototype 对象。这意味着新创建的对象可以继承构造函数原型上的属性和方法。

  3. 构造函数调用
    接下来,构造函数会被调用,并将新创建的对象作为 this 上下文。这意味着在构造函数内部,你可以使用 this 关键字来访问和修改新创建的对象。

  4. 执行构造函数体
    构造函数的代码(函数体)会被执行。在这个过程中,你可以定义新对象的属性、方法,以及执行其他任何初始化代码。

  5. 返回新对象
    如果构造函数没有显式地返回一个非原始值(即非 nullundefined、数字、字符串或布尔值),那么 new 表达式的结果就是新创建的对象。如果构造函数返回了一个对象,那么这个返回的对象将替代新创建的对象,并作为 new 表达式的结果。

  6. 实例属性和方法
    在构造函数中定义的任何属性和方法都将成为新创建对象的实例属性和方法。这些属性和方法仅对当前实例可见,每个实例都会有自己的一套属性和方法的副本。

下面是一个使用 new 关键字创建函数实例的示例:

function Person(name, age) {this.name = name;this.age = age;this.introduce = function() {console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);}
}var john = new Person('John', 30);
john.introduce(); // 输出: Hello, my name is John and I am 30 years old.

在这个例子中:

  • Person 是一个构造函数。
  • 使用 new Person('John', 30) 创建了一个新的 Person 实例。
  • 新对象的 [[Prototype]] 链接被设置为 Person.prototype
  • 构造函数被调用,并设置了新对象的 nameage 属性,以及 introduce 方法。
  • introduce 方法是定义在新对象上的实例方法,每个实例都会有自己的方法副本。
  • john 变量引用了新创建的 Person 实例,并可以调用其 introduce 方法。

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

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

相关文章

[NSSCTF 2nd]MyJs

做一题ejs原型链污染 首先是登录界面 源码里面提示了源码的路由 js不熟先审计一下 const express require(express); #导入Express框架,用于构建Web应用程序的服务器和路由 const bodyParser require(body-parser); #导入body-parser中间件,用于解析…

软考证书=职称证书?

官方的回答 根据《计算机技术与软件专业技术资格(水平)考试暂行规定》(国人部发〔2003〕39号)规定,通过考试并获得相应级别计算机专业技术资格(水平)证书的人员,表明其已具备从事相…

学习Android的第二十二天

目录 Android ContextMenu 上下文菜单 ContextMenu 范例 参考文档 Android SubMenu 子菜单 范例 参考文档 Android PopupMenu 弹出菜单 范例 参考文档 Android ContextMenu 上下文菜单 在Android开发中,ContextMenu(上下文菜单)为…

使用Javassist 在android运行时生成类

序言 最近在写框架,有一个需求就是动态的生成一个类,然后查阅了相关文献,发现在android中动态生成一个类还挺麻烦。因次把一些内容分享出来,帮助大家少走弯路。 方案一 DexMaker DexMaker 是一个针对 Android 平台的库&#xf…

Myqsort:基于冒泡排序算法的C语言实现

我们将详细介绍一个基于冒泡排序算法的自定义排序函数——Mysqrt。该函数通过使用用户提供的比较函数进行元素间的比较&#xff0c;并结合swap交换函数对任意类型的数据进行排序。下面是对代码的逐行解析。 逻辑导图 代码实现 // 头文件 #include<stdio.h>// 定义比较函…

华为自动驾驶技术详解报告分享

ADS2.0首发搭载问界M5智驾版&#xff0c;城市NCA计划年底全国开通。2023年4月16日华为在智能汽车解决方案发布会上发布了最新的ADS2.0产品&#xff0c;硬件数量减少至27个(11个摄像头12个超声波雷达3个毫米波雷达1个激光雷达,ADS1.0有34个)&#xff0c;车载计算平台改为MDC610&…

python自学2

第一阶段第三章 if&#xff0c;elif&#xff0c;else语句 这个是有顺序的&#xff0c;如果第一个满足下面的就不会执行&#xff0c;else也可以不写&#xff0c;执行的效果等同于三个独立的if。 还可以写的更加简洁一些 直接输入的参数带入到判断里面去 小练习&#xff1a; 做…

打造专属投屏体验:Windows系统投屏到iOS系统

想要将电脑投屏共享给同事或朋友&#xff0c;又担心隐私内容泄露&#xff1f;来来来&#xff0c;这里有妙招&#xff01; AirDroid Cast网页版让电脑投屏变得挑剔&#xff0c;只展示你允许共享的内容。会议资料、个人照片、敏感文件&#xff0c;都将得到严格的筛选&#xff0c;…

云原生之容器编排实践-ruoyi-cloud项目部署到K8S:Nacosv2.2.3

背景 前面搭建好了 Kubernetes 集群与私有镜像仓库&#xff0c;终于要进入服务编排的实践环节了。本系列拿 ruoyi-cloud 项目进行练手&#xff0c;按照 MySQL &#xff0c; Nacos &#xff0c; Redis &#xff0c; Nginx &#xff0c; Gateway &#xff0c; Auth &#xff0c;…

传输层Transport layer (ISO15118-20:2022) (7.7 part1) -- TCPUDP

7.7 Transport layer 这段描述阐明了文档中子条款及其所有子条款的特定要求,这些要求分别适用于私有SECC(Supply Equipment Communication Controller)和公共SECC。除非在特定子条款或其内部的任何子条款中另有说明,否则不应将私有SECC和公共SECC视为可互换的。 这意味着…

问题解决 | RuntimeError: CUDA error: invalid device ordinalCUDA kernel errors

错误&#xff1a; RuntimeError: CUDA error: invalid device ordinal CUDA kernel errors might be asynchronously reported at some other API call, so the stacktrace below might be incorrect. For debugging consider passing CUDA_LAUNCH_BLOCKING1. Compile with TO…

windows环境下Grafana+loki+promtail入门级部署日志系统,收集Springboot(Slf4j+logback)项目日志

&#x1f339;作者主页&#xff1a;青花锁 &#x1f339;简介&#xff1a;Java领域优质创作者&#x1f3c6;、Java微服务架构公号作者&#x1f604; &#x1f339;简历模板、学习资料、面试题库、技术互助 &#x1f339;文末获取联系方式 &#x1f4dd; 往期热门专栏回顾 专栏…

动态规划DP之背包问题4---分组背包问题

目录 DP分析&#xff1a; 例题&#xff1a; 01背包&#xff1a; 一种物品只有一件 动态规划DP之背包问题1---01背包问题-CSDN博客 完全背包&#xff1a;一种物品有无限件 动态规划DP之背包问题2---完全背包问题-CSDN博客 多重背包&#xff1a;一种物品有有限…

【三维重建】【SLAM】SplaTAM:基于3D高斯的密集RGB-D SLAM(CVPR 2024)

题目&#xff1a;SplaTAM: Splat, Track & Map 3D Gaussians for Dense RGB-D SLAM 地址&#xff1a;spla-tam.github.io 机构&#xff1a;CMU&#xff08;卡内基梅隆大学&#xff09;、MIT&#xff08;美国麻省理工&#xff09; 总结&#xff1a;SplaTAM&#xff0c;一个新…

十个勤天生菜原价4.9元被炒到300元,2024新商机!新兴创业项目!

近日&#xff0c;一则关于生菜价格暴涨的新闻引起了广泛关注。原价4.9元的生菜&#xff0c;在短短时间内被炒至300元&#xff0c;令人咋舌。在这背后&#xff0c;除了市场供需失衡、炒作等因素外&#xff0c;我们不禁思考&#xff1a;这样的现象背后是否隐藏着更大的商机&#…

怎么更改淘宝开店时间

更改淘宝开店时间的注意事项与建议 在淘宝上开店&#xff0c;对于许多卖家来说&#xff0c;选择合适的开店时间是非常重要的。本文将为您介绍如何更改淘宝开店时间&#xff0c;以及在更改过程中需要注意的事项和建议。 一、如何更改淘宝开店时间 在淘宝上更改开店时间相对简…

LaTeX插入图片占位符

关于插入图片更多说明&#xff08;多图并排、子标题设置等&#xff09;可参考链接 LaTeX插入图片 插入图片占位符 参考链接&#xff1a;https://blog.csdn.net/yq_forever/article/details/129431799 在论文草稿阶段有的时候想先插入图片占位符拟定大纲或写作思路&#xff0…

张宇30讲学习笔记

初等数学 x \sqrt{x} x ​是算数平方根&#xff0c;一定≥0&#xff1b; x 2 \sqrt{x^2} x2 ​|x| x2|x2||x|2 x3≠|x3||x|3 不等式 a>0&#xff0c;b>0&#xff0c;则ab≥2 a b \sqrt{ab} ab ​ 对数 ln a b \frac{a}{b} ba​lna-lnb 高等数学 单调性 线性代数

Linux CentOS使用Docker部署Apache Superset并实现远程分析数据

文章目录 前言1. 使用Docker部署Apache Superset1.1 第一步安装docker 、docker compose1.2 克隆superset代码到本地并使用docker compose启动 2. 安装cpolar内网穿透&#xff0c;实现公网访问3. 设置固定连接公网地址 前言 Superset是一款由中国知名科技公司开源的“现代化的…

WordPress排除调用某个分类下的文章

wordpress在调用分类下文章时&#xff0c;有时需要排除调用某个分类的文章&#xff0c;下面的这段代码&#xff0c;就可以轻松实现不调用特定ID的分类内容。 <?phpquery_posts("showposts10&cat-1"); //cat-1为排除ID为1的分类下文章while(have_posts()) : …