在函数中声明默认参数在幕后有什么作用?

2024-04-28

这不是调试问题或操作方法问题。这是一个概念性问题。

我发现很难理解什么this https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Default_parameters#scope_effects“第二范围”的事情是,但忽略细节我想出了这个解释:

如果一个函数(以某种方式)像这样存储:

{
  // function body written using undefined parameters. 
  // When the function is called the arguments are assigned to the parameters.
}

声明默认参数的作用是:

{ // Second scope
  parameter1 = "something"
  parameter2 = 5
  {
    // function body written using the above parameters. 
    // When the function is called the arguments or default values get assigned to the parameters.
  }
}

这真的是幕后发生的事情吗?如果没有,那里面会发生什么?这ECMAScript 文档 https://tc39.es/ecma262/#sec-functiondeclarationinstantiation are way高于我的水平。也许有人可以用通俗易懂的方式提供解释?谢谢!


这是一个很好的解释!是的,参数列表有它自己的范围。让我稍微扩展一下你的解释,然后解释为什么有额外的范围。

当您调用没有默认参数值的函数时,将为函数体创建一个新作用域,并在该作用域中创建参数,就像函数中的顶级变量一样。所以,从概念上来说:

<<
    let param1 = /*...the argument value provided for param 1 if any */;
    let param2 = /*...the argument value provided for param 2 if any */;

    // Start of function code
    var variable1;
    let variable2;
    // End of function code
>>

(我在用着<</>>分隔符而不是{/}因为作用域不仅仅是块作用域,它们隔离var以及;所以我选择了一个任意的分隔符。)

当存在默认参数值时,正如您所描述的,会涉及一个额外的范围:

<<
    let param1 = /*...the argument value provided for param 1 if any */;
    let param2 = /*...the argument value provided for param 2 if any */;
    <<
        // Start of function code
        var variable1;
        let variable2;
        // End of function code
    >>
>>

原因是默认参数值是表达式,而不仅仅是文字。例如:

function example(a = 1, b = a + 1) {
//                          ^^^^^−−−−−−−−−−−−− expression, not just literal
    return a + b;
}

console.log(example());  // 1 + (1 + 1) = 3
console.log(example(2)); // 2 + (2 + 1) = 5

重要的原因之一是,如果参数列表和函数体只有一个作用域,则意味着参数列表中的表达式可以引用函数体中声明的提升变量和函数。提升的变量只有值undefined,所以这没有用,但是提升的函数将用它们的函数体初始化,导致这样的情况:

// Doesn't work because of the additional scope
function example(a, b = blarg()) {
    function blarg() {
        return 42;
    }
    // ...
}

这会导致 ReferenceError,因为函数体的作用域在参数列表的作用域中不可用。

IIRC 有赞成和反对的争论,也有相当多的讨论,但最终决定将参数列表放在自己的范围内,以防止出现这种情况和其他奇怪的情况。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

在函数中声明默认参数在幕后有什么作用? 的相关文章

  • onclick 函数上的 CSS 选择器

    有没有办法让CSS选择器onclick function 您可以在onclick https stackoverflow com questions 24365416 select element which have specific a
  • 优化数据可视化 Web 应用程序的性能

    我正在重写 3 年前编写的数据可视化网络工具 从那时起 浏览器的 JavaScript 引擎变得更快 所以我正在考虑将部分工作从服务器转移到客户端 在页面上 数据在表格和地图 或图表 中可视化 它使用相同的数据 但以不同的方式 因此准备显示
  • 使用画布元素作为文本区域

    我正在寻找有关如何使用类似于文本区域的画布元素的直接描述 我见过这样的项目Ace http ace ajax org 只是想知道如何像文本区域一样写入该区域 只是纯文本 没有什么花哨的 提前致谢 Ace 曾经是 Mozilla Skywri
  • 在查询中实现函数调用(分组运行总计)

    我有一个函数叫做fxGroupedRunningTotal fxGRT 和查询 总计 我想在 Totals 中调用 fxGRT 以便获得一个显示分组运行总计的列 我只能通过导入总计查询来测试 fxGRT 使用总计并调用 fxGRT 的查询
  • 将组件注册到现有的 Vue.js 实例

    我是 Vue js 新手 我想注册一个本地组件 如下所述 https v2 vuejs org v2 guide components html Local Registration https v2 vuejs org v2 guide
  • Sails.js - 如何更新嵌套模型

    attributes username type email validated by the ORM required true password type string required true profile firstname s
  • Chrome 内存/垃圾收集问题

    我在使用 Chrome 时遇到内存 垃圾收集问题 我正在开发一个照片上传网站 该网站允许我的客户使用 HTML5 和文件 API 拖放照片进行上传 因此这在 IE 中不起作用 它仅适用于 Chrome 和 FF 我还没有在 Safari O
  • Twitter Bootstrap 轮播在加载时自动播放

    使用twitter bootstrap框架 如何调用轮播来 自动滑动 这意味着当页面加载时 轮播会自动滚动 我尝试过 javascript onLoad click 函数 a 下一个链接的 但这不起作用 你应该这样做Twitter Boot
  • 语法:const {} = 变量名,任何人都可以解释或指出我正确的方向[重复]

    这个问题在这里已经有答案了 这个语法在 JavaScript 中意味着什么 可能是 ES6 const 变量名 我目前正在尝试掌握 React 在很多例子中我都遇到过这种语法 例如 const girls guys women men st
  • 如何删除从 javascript var 转义的反斜杠?

    我有这个变量 var x div class Which is div class 但是我需要 div class abcdef 我怎样才能 unes cape 这个变量来删除所有转义字符 您可以通过正则表达式将反斜杠后跟引号替换为仅引号
  • Javascript:通过将路径作为字符串传递给对象来获取对象的深层值[重复]

    这个问题在这里已经有答案了 可能的重复 使用字符串键访问嵌套的 JavaScript 对象 https stackoverflow com questions 6491463 accessing nested javascript obje
  • 属性访问器(getter)的扩展运算符问题

    我很难理解为什么以下代码存在一些问题https jsfiddle net q4w6e3n3 3 https jsfiddle net q4w6e3n3 3 Note 所有示例均在 chrome 版本 52 0 2743 116 中进行测试
  • 添加选项以选择框而不用 Internet Explorer 关闭该框?

    我正在尝试构建一个包含多个下拉选择框的网页 这些下拉选择框在首次打开时异步加载其选项 这在 Firefox 下工作得很好 但在 Internet Explorer 下则不然 下面是我想要实现的目标的一个小例子 基本上 有一个选择框 ID 为
  • 大型应用的回流/布局性能

    我正在使用 GWT 构建一个 HTML 应用程序 其性能总体上是正确的 有时 它会加载 DOM 中的许多对象 并且应用程序会变得很慢 我使用 Chrome 开发者工具分析器来查看时间花在哪里 在 Chrome 下 一旦应用程序被编译 即没有
  • 清理 html 字符串中的所有脚本

    HTML5 剪贴板很棒 但我正在寻找一种使其安全的方法 用户正在将文本 html 粘贴到我的网页中 这允许他们粘贴图像 表格等 我正在寻找一种方法 在将粘贴的内容添加到页面之前删除所有脚本 我需要删除
  • 不可见的 reCAPTCHA - 缺少必需的参数:sitekey

    我正在为每个带有具有类的按钮的表单动态加载不可见的 reCAPTCHAg recaptcha 我遇到的问题是验证码未正确加载 我不知道为什么 我按照验证码网站上的文档进行操作 但我不确定如何以及为什么会出现此错误 Uncaught Erro
  • 使用 Socket.IO 时如何访问会话标识符?

    我有一个聊天 我需要管理独特的连接 我四处搜寻 但我找到的解决方案似乎都已被弃用 那么 如何使用 Socket IO 获取套接字的会话 ID 我在用着Node js http en wikipedia org wiki Node js Ex
  • 当选项卡重新加载(chrome 扩展)时,如何运行此脚本?

    所以我想在指定 URL 中重新加载选项卡时运行脚本 它几乎可以工作 但实际上 id 不能 这是我的清单文件 manifest version 2 name Sample Extension description Sample Chrome
  • 使用 div 或表格来包含链接列更好吗?

    我的页面底部有 3 列链接 每列都放入一个 div 中 所有三个 div 都包装在页面中央的一个大 div 中 这是更适合桌子的东西还是桌子不适合这项工作 您还可以使用 ul http www w3schools com tags tag
  • React 错误:目标容器不是 DOM 元素

    我刚刚开始使用 React 所以这可能是一个非常简单的错误 但我们开始吧 我的html代码非常简单 load staticfiles

随机推荐