资讯专栏INFORMATION COLUMN

let 和 const 的坑

wenzi / 3377人阅读

摘要:上面的代码并不意味着变量没有被提升。中所有的定义都会被提升,即。但是,,在实例阶段,会被初始化为。而,,则没有被初始化,所以在执行阶段的时候,在定义它们的代码运行前访问会导致。

来自twitter的问题:https://twitter.com/mxstbr/st...

const someFunc = (something) => {
  switch (something) {
    case "abc":
      const items = ["asdf"]
      return items
    case "xyz":
      const items = ["bla"]
      //    ↑
      //    Babel complains here about a
      //    "Duplicate declaration "items""
      //    (see below)
      //    Why??
      return items
  }
}

会报错的原因是代码中只有一个作用域,即花括号({})包扩的部分,解决的方法:

const someFunc = (something) => {
  switch (something) {
    case "abc": { // 增加块级作用域
      const items = ["asdf"]
      return items;
    } // 
    case "xyz": { // 增加块级作用域
      const items = ["bla"]
      return items;
    } //
  }
}

上面的例子对let也适用。

hoist

(function() {
    x; // undefined
    y; // Reference error: y is not defined

    var x = "local";
    let y = "local";
}());

上面的代码并不意味着变量y没有被提升。

JavaScript 中所有的定义都会被提升(hoist),即var, let, const, function, function*, class。

但是var,function,function*在“实例阶段”(instantiated),会被初始化为undefined。

而let,const,class则没有被初始化(emporal dead zone),所以在执行阶段的时候,在定义它们的代码运行前访问会导致ReferenceError。

spec:Let and Const Declarations

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/84025.html

相关文章

  • node调用微信JS SDK遇到的坑

    摘要:废话不多说来说说用做服务端调用微信遇到的坑。微信都有说明不做赘述。因为以后微信返回的值才会改变,并且微信规定每天限定的访问次数如果使用库的话优势可以减少对微信服务器访问的次数提升性能。 这几天要做一个H5的页面,之前没做。对我来说也是一次对新领域的接触。废话不多说来说说用node做服务端调用微信JS SDK遇到的坑。首先讲一下思路: 微信JS-SDK说明文档 绑定域名 引入JS文件 ...

    Godtoy 评论0 收藏0
  • vue better-scroll 遇到的坑

    摘要:先看效果介绍一个简单的静态页面主要是使用做横向滚动,点击标签滚动到相应位置,以及滚到相应位置后对应标签显示红色。 先看效果 showImg(https://segmentfault.com/img/bVbqAdC?w=374&h=626); 介绍 一个简单的静态页面主要是使用 better-scroll 做横向滚动,点击标签滚动到相应位置,以及滚到相应位置后对应标签显示红色。开发过程中...

    yiliang 评论0 收藏0
  • 总结前端走 gRPC 协议所遇到的坑

    摘要:坑点一不支持浏览器环境首先你应该了解,它的目标是将编译文件所生成的文件夹包含和文件。坑点二所提供的方法只支持回调函数以上是官方给出的例子,发送一个标准请求。 坑点一:ts-protoc-gen 不支持浏览器环境 首先你应该了解 ts-protoc-gen,它的目标是将编译 .proto 文件所生成的文件夹包含 .js 和 .d.ts 文件。 但是... 请不要将 ts-protoc...

    Eminjannn 评论0 收藏0
  • 移动端 Modal 组件开发杂谈

    摘要:网上谷歌一下滚动穿透关键字其实可以发现很多种解决方案,每个方案也各有优缺点,但我们选择的解决方案是团队的一姐一篇移动端体验优化的博文中得到的启示博文地址花式提升移动端交互体验。 Vant 是有赞开发的一套基于 Vue 2.0 的 Mobile 组件库,在开发的过程中也踩了很多坑,今天我们就来聊一聊开发一个移动端 Modal 组件(在有赞该组件被称为 Popup )需要注意的一些坑。 在...

    learn_shifeng 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<