建议：
在function里时应使用var 申明变量，这样改变量仅仅只在function的生存周期内存在，不会污染到,全局控件。至于直接在<script>标签内使用的话则申明不声明效果都是一样的。
下面的文章可以帮助你更清楚的了解js变量
一、变量的类型
Javascript和Java、C这些语言不同，它是一种无类型、弱检测的语言。它对变量的定义并不需要声明变量类型，我们只要通过赋值的形式，可以将各种类型的数据赋值给同一个变量。例如：
i=100//Number类型
i="variable"//String类型
i={x:4}//Object类型
i=[1,2,3]//Array类型
JS的这种特性虽然让我们的编码更加灵活，但也带来了一个弊端，不利于Debug，编译器的弱检测让我们维护冗长的代码时相当痛苦。
二、变量的声明
JS中变量申明分显式申明和隐式申明。
var i=100//显式申明
i=100//隐式申明
在函数中使用var关键字进行显式申明的变量是做为局部变量，而没有用var关键字，使用直接赋值方式声明的是全局变量。
当我们使用访问一个没有声明的变量时，JS会报错。而当我们给一个没有声明的变量赋值时，JS不会报错，相反它会认为我们是要隐式申明一个全局变量，这一点一定要注意。
三、全局变量和局部变量
当JS解析器执行时，首先就会在执行环境里构建一个全局对象，我们定义的全局属性就是做为该对象的属性读取，在顶层代码中我们使用this关键字和window对象都可以访问到它。而函数体中的局部变量只在函数执行时生成的调用对象中存在，函数执行完毕时局部变量即刻销毁。因此在程序设计中我们需要考虑如何合理声明变量，这样既减小了不必要的内存开销，同时能很大程度地避免变量重复定义而覆盖先前定义的变量所造成的Debug麻烦。
四、变量作用域
任何程序语言中变量的作用域都是一个很关键的细节。JS中变量的作用域相对与JAVA、C这类语言显得更自由，一个很大的特征就是JS变量没有块级作用域，函数中的变量在整个函数都中有效，运行下面代码：
<SCRIPT LANGUAGE="JavaScript" type="text/javascript">
//定义一个输出函数
function outPut(s){
document.writeln(s)
}
//全局变量
var i=0
//定义外部函数
function outer(){
//访问全局变量
outPut(i)// 0
//定义一个类部函数
function inner(){
//定义局部变量
var i = 1
// i=1如果用隐式申明 那么就覆盖了全局变量i
outPut(i)//1
}
inner()
outPut(i)//0
}
outer()
</SCRIPT>
输出结果为0 1 0，从上面就可以证明JS如果用var在函数体中声明变量，那么此变量在且只在该函数体内有效，函数运行结束时，本地变量即可销毁了。
由于上面的这个JS特性，还有一个关键的问题需要注意。此前一直使用ActionScript，虽然它和JS都是基于ECMA标准的，但在这里还是略有不同的。例如下面代码：
<SCRIPT LANGUAGE="JavaScript" type="text/javascript">
//定义一个输出函数
function outPut(s){
document.writeln(s)
}
//全局变量
var i=0
//定义外部函数
function outer(){
//访问全局变量
outPut(i)// 0
//定义一个类部函数
function inner(){
outPut(i)//undefiend
var i=1
outPut(i)//1
}
inner()
outPut(i)//0
}
outer()
</SCRIPT>
你可能认为输出结果是0 0 1 0，事实上在AS中确实是这样的，而在JS中的输入却是0 undefined 1 0，为何会这样了？刚才我们说到了JS函数体中声明的本地变量在整个函数中都有效，因此在上面代码中var i = 1 在inner函数中都有效，实际上显式声明的变量i是在预编译时就已经编译到调用对象中了，不同于隐式声明变量在解释时才被定义为全局变量，只是在调用outPut(i)时，还没有将它初始化变量，此时的本地变量i是未赋值变量，而不是未定义变量，因此输出了undefined。上面的代码等效于下面代码：
function inner(){
var i//定义但不赋值
outPut(i)//undefiend
i=1
outPut(i)//1
}
为了避免上面的这类问题，因此在函数开始位置集中做函数声明是一个极力推荐的做法。
五、基本类型和引用类型
JS不同于JAVA、C这些语言，在变量申明时并不需要声明变量的存储空间。变量中所存储的数据可以分为两类：基本类型和引用类型。其中数值、布尔值、null和undefined属于基本类型，对象、数组和函数属于引用类型。
基本类型在内存中具有固定的内存大小。例如：数值型在内存中占有八个字节，布尔值只占有一个字节。对于引用型数据，他们可以具有任意长度，因此他们的内存大小是不定的，因此变量中存储的实际上是对此数据的引用，通常是内存地址或者指针，通过它们我们可以找到这个数据。
引用类型和基本类型在使用行为上也有不同之处：
<SCRIPT LANGUAGE="JavaScript" type="text/javascript">
//定义一个输出函数
function outPut(s){
document.writeln(s)
}
var a = 3
var b = a
outPut(b)
//3
a = 4
outPut(a)
//4
outPut(b)
//3
</SCRIPT>
对基本类型b进行赋值时，实际上是又开辟了一块内存空间，因此改变变量a的值对变量b没有任何影响。
<SCRIPT LANGUAGE="JavaScript" type="text/javascript">
//定义一个输出函数
function outPut(s){
document.writeln(s)
}
var a_array = [1,2,3]
var b_array = a_array
outPut(b_array)//1,2,3
a_array[3] = 4
outPut(b_array)//1,2,3,4
</SCRIPT>
上面是对引用类型的变量赋值，实际上他们传递的是对内存地址的引用，因此对a_array和b_array的存取，实际上都是操作的同一块内存区域。如果希望重新分配内存空间存储引用型变量，那么我就需要使用克隆方法或者自定义方法来复制引用变量的数据。
一、js全局变量和局部变量
1、全局变量和它的作用域
全局变量是指在程序开头的说明部分定义和说明的量。它的作用域分为两种情况：
1）在全局变量和局部变量不同名时，其作用域是整个程序。
2）在全局变量和局部变量同名时，全局变量的作用域不包含同名局部变量的作用域。
2、局部变量和它的作用域
凡是在子程序内部使用的变量，必须在子程序中加入说明。这种在子程序内部说明的变量称为局部变量。局部变量的作用域是其所在的子程序。形式参数也只能在子程序中有效。因此也属于局部变量。局部变量的作用域分为两种情况：
1）当外层过程序的局部变量名和嵌套过程中的局部变量不同名时，外层过程的局部变量作用域包含嵌套过琛。
2）当外层过程的局部变量名和嵌套过程内的局部变量名同名时，外层局部变量名的作用域不包含此过程。
二、js定义变量需要注意以下内容：
1、Javascript的变量的scope是根据方法块来划分的（也就是说以function的一对大括号｛ ｝来划分）；切记，是function块，而for、while、if块并不是作用域的划分标准
2、Javascript在执行前会对整个脚本文件的声明部分做完整分析(包括局部变量)，从而确定实变量的作用域
3、当全局变量跟局部变量重名时，局部变量的scope会覆盖掉全局变量的scope，当离开局部变量的scope后，又重回到全局变量的scope
三、js定义变量时，var和this的区别
1、var的规则是: 使用var声明变量就是内部变量, 否则就是先调用全局变量, 不管多少层函数
2、this的规则是: method函数里的this永远指向自身, 普通函数的this永远指向DOMWindow
附件为var和this区别的示例代码！
变量提升
变量与函数名提升优先级
js 作用域内有变量，这个很好理解，但有一些细节需要注意。
console.log(foo) // 函数function foo(){console.log("函数声明")
}
console.log(foo) // 函数var foo = "变量"
console.log(foo) // 变量
当变量名与函数名同名，且都提升上去了，那最终结果是哪个声明起作用呢？
有两个知识点：
1. var foo并不会覆盖之前的变量
2. 函数提升优先级比变量提升要高，且不会被变量声明覆盖，但是会被变量赋值覆盖，所以上面的代码实际上是
function foo(){ // 优先级最高，提升到最前面console.log("函数声明")
}var foo // 只提升声明，不提升赋值，且不能覆盖函数声明console.log(foo)
console.log(foo)
foo = "变量" // 可以覆盖函数声明console.log(foo)
连等赋值的变量提升
var num1 = 1 function fn(num3){console.log(num1) //output undefined
console.log(num3) //output 4
console.log(num4) //throw error “num4 is not defined”
console.log(num2) //throw error “num2 is not defined”
var num1 = num4 = 2 // js 连等赋值 num4 不会被提升
num2 = 3 // 没有 var 会挂载到全局作用域,但不会提升,所以之前会报错
var num3= 5
}
fn(4)
if 判断内变量提升
if (true) {function fn(){ return 1 }
}else {
if(false){
function fn(){ return 2 }
}
}
console.log(fn.toString())
console.log(fn())
以下是从找到这个例子的原文中摘抄的内容：chrome和ie一均为function fn(){ return 2}，而firefox中依然报错。
可见三者处理并不相同。ff中会提前变量的声明，但不会提前块级作用域中的函数声明。而chrome和ie下就会提前块级作用域中的函数声明，而且后面的声明会覆盖前面的声明。
函数的作用域内赋值
在js中，提到变量赋值，就要先说作用域，而作用域，在es6之前，只有函数才会形成独立的作用域，然后函数的嵌套形成了 js 的作用域链。子作用域内可以访问父级作用域内的元素。函数的作用域在函数确定的时候就已经确定，与调用无关。
// test1var x = 1function foo(x) {var x = 3 var y = function() {
x = 2
console.log(x)
}
y()
console.log(x) return y
}var z = foo() // 2 2z() // 2
这段函数会输出三个 2 ，指向同一个 x，甚至，将 x 改为对象，就更明显了
// test2var x = "abc"function foo(x) {var x = c var y = function() {
return x
} return y
}var c = {a:1}var z = foo()
var b = z()
console.log(b === c) // true
上面例子中，foo 函数执行后，返回 y 函数并赋值给 z，z 指向 y 函数（函数体)，此时，z 并不在 foo 函数的作用域内，在此作用域不能访问到 x，但 z 只是引用类型数据的一个指针，只是同 x 指向了同一个对象而已。而执行 z 函数，则会返回 x 的值，这个值是函数 y 作用域内访问到的 x 的值，是根据函数的书写位置确定的作用域，并不会因为调用位置不同，而改变变量的指向。
但是同时要注意，虽然函数作用域在函数写出来时就已经确定，但具体的值却跟调用的时机有关。
// test3var x = "abc"function foo(x) {var x = c var y = function() {
x.a++ return x
} return y
}var c = {a:1}var z = foo()
console.log(z()) // {a: 2}console.log(z()) // {a: 3}console.log(z()) // {a: 4}
这个例子中，输出的三次都是同一个对象，但输出的值不同，这是因为输出的时候的值不同，这就和调用时的实际值有关了。
