Javascript学习笔记二 之 变量

一.关于Javascript变量声明
在Javascript中,声明一个变量
var a=1;
也可以直接
a=1;
这两种表达是有区别的,
一个是当前作用域的局部变量,另一个则是当前作用域的全局变量;
 Javascript语言的特殊之处,就在于函数内部可以直接读取全局变量。 


代码如下:

var n=999;
function f1(){
alert(n);
}
f1(); // 999

另一方面,在函数外部自然无法读取函数内的局部变量。


代码如下:

function f1(){
  var n=999;
}
alert(n); // error

二.Javascript变量作用域链


代码如下:

var x='000 ';
document.writeln(x); //得出'000 '
a();
function a(){
var x='aaa ';
function b(){
document.writeln(x); //undefined
var x='bbb ';
document.writeln(x); //bbb
}
b();
document.writeln(x); //aaa
}
//结果是:000 undefined bbb aaa

原理:
 当变量使用时,先从函数块(权威指南中用调用对象来解释)中找,
 如果找不到,从上一级函数块找,直到找到,
 如果直到顶层代码(指var x='000 ';的位置)还没找到定义,代码会报未定义错误。
1.按顺序执行的顺序,输出x '000 '(这个没问题);
2.然后执行a()
3.在a()中执行b()
4.b()中需要输出x,该函数体内(作用域)有x定义,但是还未赋值,因此输出undefined;(重点!)
5.然后再输出x,x已赋值,因此输出bbb;
6.最后输出aaa;
了解了以上原理,我们来看下面的例子


代码如下:

var x = "global";
function f() {
var x='f1';
function f2(){
x='f2' ;//这里我有些混淆,GLOBAL的X应该重新被赋值为'f2'
alert(x); //返回"f2"
alert(window.x); //返回"global"
}
f2();
alert(x) //返回"f2"
}
f();
alert(x); //返回"global",没有被重新赋值为:f2
//结果分别弹出:f2 global f2 global

解释:
 首先执行f()中的f2(),
f2()为内部函数产生一个作用域,因此x=‘f2'修改的是f()中的x值,而非全局x.
alert(x);为‘f2',alert(window.x)为‘global'.
然后执行alert(x);这个x的作用域为全局,为‘global'
三.给新手的建议
1.减少全局变量(解决方案:把变量封装到对象中)
引用:
“把你踩在全局的那些乱七八糟的脚印都归于一人名下,能显著降低与其他应用、小工具或JS库冲突的可能性。”
– Douglas Crockford


代码如下:

var name = 'Jeffrey';
var lastName = 'Way';
function doSomething() {...}
console.log(name); // Jeffrey -- or window.name

更好的写法


代码如下:

var DudeNameSpace = {
name : 'Jeffrey',
lastName : 'Way',
doSomething : function() {...}
}
console.log(DudeNameSpace.name); // Jeffrey

注意看,我们是如何戏剧化地把“乱七八糟的脚印”都归到“DudeNameSpace”这对象之下的;
2.一长列变量声明?别写那么多var,用逗号吧


代码如下:

var someItem = 'some string';
var anotherItem = 'another string';
var oneMoreItem = 'one more string';

更好的写法


代码如下:

var someItem = 'some string',
anotherItem = 'another string',
oneMoreItem = 'one more string';

不言自明。我不知道这样做能否提升代码执行速度,但是确实让你的代码干净许多。

(0)

相关推荐

  • Javascript学习笔记二 之 变量

    一.关于Javascript变量声明 在Javascript中,声明一个变量 var a=1; 也可以直接 a=1; 这两种表达是有区别的, 一个是当前作用域的局部变量,另一个则是当前作用域的全局变量: Javascript语言的特殊之处,就在于函数内部可以直接读取全局变量. 复制代码 代码如下: var n=999; function f1(){ alert(n); } f1(); // 999 另一方面,在函数外部自然无法读取函数内的局部变量. 复制代码 代码如下: function f1(

  • PHP 面向对象程序设计(oop)学习笔记 (二) - 静态变量的属性和方法及延迟绑定

    Static(静态)关键字用来定义静态方法和属性,static 也可用于定义静态变量以及后期静态绑定. 1.静态变量 static variable 静态变量仅在局部函数域中存在,但当程序执行离开此作用域时,其值并不丢失.也就是说,在下一次执行这个函数时,变量仍然会记得原来的值.要将某个变量定义为静态的,只需要在变量前加上static关键字即可. 复制代码 代码如下: function testing(){    static $a = 1;    $a *= 2;    echo $a."\n

  • JavaScript 学习笔记二 字符串拼接

    var str="hello"; str+="world"; 实际上,这段代码在幕后执行的步骤如下: (1) 创建存储"hello"的字符串. (2) 创建存储"world"的字符串. (3) 创建存储连接结果的字符串. (4) 把str的当前内容复制到结果中. (5) 把"world"复制到结果中. (6) 更新str,使它指向结果. 每次完成字符串连接都会执行步骤2到6,使得这种操作非常消耗资源.如果重

  • javascript学习笔记(二) js一些基本概念

    1.typeof 操作符:用于检测给定变量的数据类型 复制代码 代码如下: var message="some string"; alert(typeof message); //"string" alert(typeof(message)); //"string" alert(typeof 100); //"number" typeof操作符可能返回下列字符串: "undefined","boo

  • javascript学习笔记(二十) 获得和设置元素的特性(属性)

    本节html以下面的为例 复制代码 代码如下: <div id="myDiv" class="bd" title="我是div"> <img id="img1" /> <a id="myA" href = "http://www.baidu.com">百度</a> </div> 1.通过HTMLElement类型(对象)的属性获

  • javascript学习笔记_浅谈基础语法,类型,变量

    基础语法.类型.变量 非数字值的判断方法:(因为Infinity和NaN他们不等于任何值,包括自身) 1.用x != x ,当x为NaN时才返回true; 2.用isNaN(x) ,当x为NaN或非数字值时,返回true; 3.用isFinity(x),在x不是NaN.Infinity.-Infinity时返回true; 虽然(字符串.数字.布尔值)不是对象,他们的属性是只读的,但也可以像操作对象一样来引用他们的属性和方法,原理: javascript构造一个(String.Number.Boo

  • JavaScript学习笔记之DOM基础 2.4

    DOM的发展,与WEB标准化的大趋势相关甚密.只有基于正确的语义逻辑,DOM才能正确地发挥其功用.如今,正确的语义结构.表现与内容分离等要求,都已经成为网页设计中的基本要求.因此,在网页前端开发中,DOM的存在,无疑是为表现层.行为层甚至内容层面的连接提供了一个绝佳的API,成为热门的Ajax应用中不可或缺的组成部分. 一.平稳退化 1.概念 早期,在未使用JavaScript之前,网页中的内容可以正常显示出来,用户可以通过外设(如鼠标)操控浏览到相关内容,这种浏览体验对用户而言可能并不理想.

  • JavaScript学习笔记之创建对象

    JavaScript 有Date.Array.String等这样的内置对象,功能强大使用简单,人见人爱,但在处理一些复杂的逻辑的时候,内置对象就很无力了,往往需要开发者自定义对象. 从JavaScript定义上讲对象是无序属性的集合,其属性可以包含基本值.对象或函数.也就是说对象是一组没有特定顺序的属性,每个属性会映射到一个值上,是一组键值对,值可以是数据或对象. 对象是JavaScript的基本数据类型.在JavaScript中除了字符串.数字.true.false.null和undefine

  • JavaScript学习笔记之数组去重

    推荐阅读:JavaScript学习笔记之数组的增.删.改.查 JavaScript学习笔记之数组求和方法 JavaScript学习笔记之数组随机排序 话说面试常会碰到面试官会问JavaScript实现数组去重的问题,最近刚好在学习有关于JavaScript数组相关的知识,趁此机会整理了一些有关于JavaScript数组去重的方法. 下面这些数组去重的方法是自己收集和整理的,如有不对希望指正文中不对之处. 双重循环去重 这个方法使用了两个for循环做遍历.整个思路是: 构建一个空数组用来存放去重后

  • JavaScript学习笔记(三):JavaScript也有入口Main函数

    在C和Java中,都有一个程序的入口函数或方法,即main函数或main方法.而在JavaScript中,程序是从JS源文件的头部开始运行的.但是某种意义上,我们仍然可以虚构出一个main函数来作为程序的起点,这样一来不仅可以跟其他语言统一了,而且说不定你会对JS有更深的理解. 1. 实际的入口 当把一个JavaScript文件交给JS引擎执行时,JS引擎就是从上到下逐条执行每条语句的,直到执行完所有代码. 2. 作用域链.全局作用域和全局对象 我们知道,JS中的每个函数在执行时都会产生一个新的

随机推荐