这里有新鲜出炉的 Javascript 教程,程序狗速度看过来!
Javascript 是一种由 Netscape 的 LiveScript 发展而来的原型化继承的基于对象的动态类型的区分大小写的客户端脚本语言,主要目的是为了解决服务器端语言,比如 Perl,遗留的速度问题,为客户提供更流畅的浏览效果。
本文主要介绍了 JavaScript 中作用域和作用域链解析,条理分明,方便理解,这里推荐给小伙伴们,有需要的朋友可以参考下
学习 js,肯定要学习作用域,js 作用域和其他的主流语言的作用域还存在很大的区别。
一. js 没有块级作用域。
js 没有块级作用域,就像这样:
- if(){
- var a = 100;
- console.log(a) //输出100
- }
- console.log(a) //输出100
js 中像 if,for,switch 之类的语句,他们包含的代码块里面的变量,在代码块外面也能被读取,所以说,js 没有块级作用域。
二. js 的全局变量
js 中规定,全局变量都可以看作是 window 的属性,而且全局变量能够被所有的代码块读取。
- var a = 10;
- function() {
- b = 20;
- console.log(a); //输出10;
- }
- console.log(b); //输出20;
虽然在匿名函数中对 a 没有定义,但是由于 a 是全局变量,所以其他任何的代码块都能够读取 a 的值。在一个复杂的项目中,全局变量如果操作不慎,很有可能带来重大的 bug。所以在平时写代码的时候,应该尽量避免使用全局变量!对于一个变量来说,如果没有用 var 来声明的话,那么会自动认为是全局变量,因此,在书写中,一定不能漏写 var。
三. js 的局部变量
js 中的全局变量,很容易使代码存在问题,所以我们应该明确区分全局变量和局部变量!局部变量只在他所在的函数内部读取,在函数外部却无法读取这个变量。
- function doSomething() {
- var blogName = "智轩资本";
- function innerSay() {
- alert(blogName);
- }
- innerSay();
- }
- alert(blogName); //undefined
- innerSay(); //undefined
四. js 的作用域链问题
由于 js 存在全局变量和局部变量,在调用一个变量是,会对他的作用域链进行查找,如果函数内部定义了这个变量,那么取该变量的值,如果没有,那么向上一层查找,如果找到了,就获取这个值,如果还没找到,继续往上层查找,直到找到位置,如果找到最后也没找到,那么该变量的值为 undefined。
先看一个例子:
- var myName = '智轩资本';
- function scoap() {
- console.log(myName);
- var myName = "zhixuan";
- console.log(myName);
- console.log(age);
- }
- scoap();
先分析一下这个例子,scoap()将调用这个函数,第一个 console.log(name),会对 name 的值进行原型链查找,首先看函数 scoap 内部是否进行了定义,发现在函数内部对 name 进行了定义,那么第一个 console.log(name)将不再往上层查找!那么第一个 console.log(name)的值是不是就是 "zhixuan" 了呢?no!no!no!由于第一个 console.log(name) 时,对 name 还没有赋值,所以,第一个 console.log(name)为 undefined,第二个 console.log(name)为 "zhixuan"!
再看一个例子:
- var a = 10;
- function zhixuan() {
- console.log(a);
- }
- function ziben() {
- var a = 20;
- zhixuan();
- }
- ziben();
这次 console.log(a)的值为多少呢?首先执行 ziben()函数,里面定义了 a 为 20,再执行 zhixuan()函数,要求输出 a 的值,由于作用域在函数定义的那一瞬间就决定了,所以,zhixuan()函数会向上查找到 a 的全局变量,即 var a=10,而不是演着 ziben()里的作用域查找!所以 console.log(a)为 10.
当然,我的这些理解比较浅,如果想要继续深入,推荐阅读:/article/17/0416/274339.html
以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流,同时也希望多多支持 phperz!
来源: http://www.phperz.com/article/17/0525/329843.html