有一定JavaScript开发经验的人应该会熟悉下面这种立即执行函数的写法:
(function(name){
console.log('hello ' + name);// hello Bob
})('Bob');
不过即使不熟悉也没关系,这里我会讲解这种写法的含义。
先来看下面这个更容易理解的示例:
var sayHello = function(name){
console.log('hello ' + name);
}
var name = 'Bob';
sayHello(name);// hello Bob
首先使用函数表达式的语法定义函数sayHello,然后声明一个变量name,紧接着调用sayHello,参数为name。
由于变量name没有在其他地方被使用,这里其实也就没有必要声明,可以使用更简便的语法,直接把值传递给函数:
sayHello('Bob');// hello Bob
按照这种逻辑,假如sayHello也是只执行一次,sayHello(name)不是也可以写成下面这种形式吗?
function(name){
console.log('hello ' + name)
}('Bob');
//Uncaught SyntaxError: Unexpected token (
但是运行发现报错了,这是因为JavaScript将function关键字当作一个函数声明的开始,而函数声明的后面是不能跟圆括号的。不过,函数表达式的后面可以跟圆括号,要将函数声明转换成函数表达式,只要像下面这样给它加上一对圆括号即可:
(function(name){
console.log('hello ' + name);// hello Bob
})('Bob');
也就是本文开头的立即执行函数,模仿块级作用域正是通过立即执行函数实现的。
来看下面的示例:
function outputNumbers(count){
for(var i = 0; i < count; ++i){
console.log(i);
}
console.log(i);// 5
}
outputNumbers(5);
在Java、C++等语言中,变量i只会在for循环的语句块中有定义,循环一旦结束,变量i就会被销毁。可是在JavaScript中,作用域只分为全局作用域和函数作用域,函数内部声明的变量是绑定在函数作用域对应的变量对象上的,也就是说这里的i是定义在函数的变量对象上的,在函数内部的任何位置都可以访问它,即使for循环结束,i依然存在。
但是如果用立即执行函数包裹for循环,情况就不一样了:
function outputNumbers(count){
(function(){
for(var i = 0; i < count; ++i){
console.log(i);
}
})();
console.log(i);//Uncaught ReferenceError: i is not defined
}
outputNumbers(5);
此时i绑定在内部立即执行函数的变量对象上,立即执行函数执行完毕就会销毁,i也会随之销毁。根据闭包机制,内部的立即执行函数也可以访问到count。这样就实现了块级作用域——无论在立即执行函数中声明什么变量都不会影响外部变量的使用。
这种技术也经常在全局作用域中被用在函数外部,从而限制向全局作用域中添加过多的变量和函数,避免冲突,例如:
(function(){
var now = new Date();
if(now.getMonth() == 0 && now.getDate() == 1){
console.log('Happy new year!');
}
})();
这段代码放在任何全局作用域中都可以在1月1日向用户显示祝贺新年的消息,不必担心全局作用域中是否定义了now变量,从而引起变量的覆盖等问题。
原文来自:https://my.oschina.net/bob1900/blog/3043173
在ES5中,只全局作用域和函数作用域。这会导致函数作用域覆盖了全局作用域;亦或者循环中的变量泄露为全局变量。用let命令新增了块级作用域,外层作用域无法获取到内层作用域,非常安全明了。
在JavaScript中使用var定义一个变量,无论是定义在全局作用域函数函数的局部作用域中,都会被提升到其作用域的顶部,这也是JavaScript定义变量的一个令人困惑的地方。由于es5没有像其它类C语言一样的块级作用域,因此es6增加了let定义变量,用来创建块级作用域。
作用域是在函数声明的时候就确定的一套变量访问规则,而执行上下文是函数执行时才产生的一系列变量的集合体。也就是说作用域定义了执行上下文中的变量的访问规则,执行上下文是在这个作用域规则的前提下执行代码的。
先声明一个name变量,然后声明一个person对象,person包含name和sayName属性。当直接在对象上进行方法的调用时:person.sayName(),函数的作用域遵循“谁调用就是谁”的原则,sayName的作用域(也就是this)指向的就是person。
几年前,消失的作用域 CSS,如今它回来了,而且比以前的版本要好得多。更好的是,W3C规范基本稳定,现在Chrome中已经有一个工作原型。我们只需要社区稍微关注一下,引诱其他浏览器构建它们的实现
静态作用域指的是一段代码,在它执行之前就已经确定了它的作用域,简单来说就是在执行之前就确定了它可以应用哪些地方的作用域(变量)。 动态作用域–函数的作用域是在函数调用的时候才决定的
作用域是你的代码在运行时,某些特定部分中的变量,函数和对象的可访问性。换句话说,作用域决定了变量与函数的可访问范围,即作用域控制着变量与函数的可见性和生命周期。
函数对象和其它对象一样,拥有可以通过代码访问的属性和一系列仅供JavaScript引擎访问的内部属性。其中一个内部属性是[[scope]],由ECMA-262标准第三版定义,该内部属性包含了函数被创建的作用域中对象的集合
ES6新增了两个重要的关键字let和const,相信大家都不陌生,但是包括我在内,在系统学习ES6之前也只使用到了【不存在变量提升】这个特性。let声明一个块级作用域的本地变量
作用域和作用域链在Javascript和很多其它的编程语言中都是一种基础概念。但很多Javascript开发者并不真正理解它们,但这些概念对掌握Javascript至关重要。
内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!