资讯专栏INFORMATION COLUMN

es6中容易忽视的细节(一)

baishancloud / 1629人阅读

摘要:但是对于复杂类型的数据数组对象,保存的是一个指针,真正的数据是存储在堆区,只能保证这个指针不会变化,不能保证里面的数据不发生变化的变量声明方式在中声明的全局变量是和顶层对象的属性对等的获取全局对象的方法

你可能不知道的let与const let

var声明的变量会发生变量提升,在var声明之前调用该变量会数处undefined,但是let声明的变量不会发生提升,在声明之前调用就会报错

// var 的情况
console.log(foo); // 输出undefined
var foo = 2;

// let 的情况
console.log(bar); // 报错ReferenceError
let bar = 2;

let不允许在相同的作用域内声明相同的变量否则会报错

 // 报错
function func() {
  let a = 10;
  var a = 1;
}

块级作用于有以下两个用处
内层变量覆盖外层变量

var tmp = new Date();  

function f() {
  console.log(tmp);
  if (false) {
    var tmp = "hello world"; // 这里会发生变量提升
  }
}

f(); // undefined

用来计数的循环变量泄露为全局变量

var s = "hello";

for (var i = 0; i < s.length; i++) {
  console.log(s[i]);
}

console.log(i); // 5

函数声明与变量声明的潜规则

允许在块级作用域内声明函数(es6规定的在严格模式下只有在{}内部才可以声明函数)

函数声明类似于var,即会提升到全局作用域或函数作用域的头部。

同时,函数声明还会提升到所在的块级作用域的头部,优先于变量的声明

funtion fun(){};
var fun;   // 这里不管先声明谁fun输出的永远都是函数
fun  //f fun(){}

const

const声明的常量声明就必须初始化也就是必须赋值,否则就会报错(若是定义引用类型数据则可以改变并不会报错)

const obj = {a:{b:2}}
a.b=3
obj    // {a:{b:3}}

同let声明的变量一样,const不能重复声明同一变量,同时const也是块级作用域

小结与扩展

const保证的实际上并不是变量的值不可改变,而是指变量存放的地址不可改变,对于简单的数据类型(数字,字符串,boolean)值就保存在变量指向的那个地址(栈区),所以是不可改变的。

但是对于复杂类型的数据(数组、对象),保存的是一个指针,真正的数据是存储在堆区,只能保证这个指针不会变化,不能保证里面的数据不发生变化

es6的变量声明方式:var function let const import export

在es5中声明的全局变量是和顶层对象的属性对等的

获取全局对象的方法

var getGlobal = function () {
  if (typeof self !== "undefined") { return self; }
  if (typeof window !== "undefined") { return window; }
  if (typeof global !== "undefined") { return global; }
  throw new Error("unable to locate global object");
};

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

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

相关文章

  • es6容易忽视细节(三)

    摘要:模块就是对象,输入时必须查找对象属性模块不是对象,而是通过命令显式指定输出的代码,再通过命令输入。大括号里面的变量名,必须与被导入模块对外接口的名称相同。 proxy代理的坑 var obj = {index:index} var newObj = new Proxy(obj,{ get:(target,key)=>{ console.l...

    Michael_Lin 评论0 收藏0
  • es6容易忽视细节(二)

    摘要:变量的解构赋值结构赋值允许使用默认值内部使用严格相等运算符,判断一个位置是否有值。所以,只有当一个数组成员严格等于,默认值才会生效。这样的层层判断非常麻烦,因此现在有一个提案,引入了传导运算符,简化上面的写法。 变量的解构赋值 结构赋值允许使用默认值 let [foo = true] = []; foo // true ES6 内部使用严格相等运算符(===),判断一个位置是否...

    RayKr 评论0 收藏0
  • koa 实现 react-view 原理

    摘要:今天,其实讲的是在实现同构过程中看到过,可能非常容易被忽视更小的一个点。每一个架构的框架都会涉及到层的展现,也不例外。这种说法即对也不对。总结其实,实现非常简单,我们也从一些维度看到了设计一个的一般方法。 在之前我们有过一篇『React 同构实践与思考』的专栏文章,给读者实践了用 React 怎么实现同构。今天,其实讲的是在实现同构过程中看到过,可能非常容易被忽视更小的一个点 —— R...

    zxhaaa 评论0 收藏0
  • 2018前端值得关注技术

    摘要:年前端有哪些领域,技术值得关注,哪些技术会兴起,哪些技术会没落。自从谷歌提出后,就持续的获得了业界的关注,热度可见一斑。就在今年,谷歌也宣布将获得与安卓原生应用同等的待遇与权限。但是无论都值得关注。 1.前言 2017悄然过去,2018已经来到。人在进步,技术在发展。2018年前端有哪些领域,技术值得关注,哪些技术会兴起,哪些技术会没落。下面就我个人的判断进行一个预测判断,希望能对大家...

    xiao7cn 评论0 收藏0
  • 2018前端值得关注技术

    摘要:年前端有哪些领域,技术值得关注,哪些技术会兴起,哪些技术会没落。自从谷歌提出后,就持续的获得了业界的关注,热度可见一斑。就在今年,谷歌也宣布将获得与安卓原生应用同等的待遇与权限。但是无论都值得关注。 1.前言 2017悄然过去,2018已经来到。人在进步,技术在发展。2018年前端有哪些领域,技术值得关注,哪些技术会兴起,哪些技术会没落。下面就我个人的判断进行一个预测判断,希望能对大家...

    用户84 评论0 收藏0

发表评论

0条评论

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