JavaScript 变量的使用

JavaScript(JS) 中"变量"的使用

  1. 变量的定义: 变量是指程序中一个已经命名的储存单位,它的主要做用就是为数据操做提供存放信息的容器。
  2. 变量的命名:
  • 必须以字母或下划线(_)开头,中间能够是数字、字母或下划线;
  • 变量名不能包括空格、加、减等符号;
  • 不能使用JS中关键字做为变量名,如int,new等;
  • JS的变量名严格区分大小写;
  1. 变量的声明与赋值:
    在JS中,var 就是专门用来声明变量的;

声明一个变量 var 变量名;
若是仅仅是声明一个变量,不对变量进行赋值,那么这个变量是有默认值(undefined)
如:var x;  输出就是 undefined
注:一个 var 能够同时声明多个变量,中间用逗号隔开。 如:var x,y,z;git


定义一个变量 var x=1;
对变量进行声明的时候,同时为变量进行赋值,对变量"x"的操做,本质就是对数值"1"的操做
注:声明变量的同时,也能够对多个变量进行赋值。如:var x=1,y=2,z=3;浏览器


注:若是对同一个变量进行屡次赋值,那么后者将覆盖前者。
如:var x=1;
  var x=2;
那么"x"的值最终为"2"
bash


使用 var 声明的变量能够进行提高 。提高就是把加 var 的变量提到代码的最前面。由于JS代码在执行以前有一个预解析,预解析的时候作了两件事,把加var的变量提高,把函数提高。函数


一个script标签就是一个代码段。预解析完后,才会执行JS代码ui


提高的时候仅仅是提高了声明
如:spa

console.log(x)   //输出结果:undefined
  var x = 666;
  console.log(x)    //输出结果:666
复制代码

上面代码至关于以下代码:code

var x;  
console.log(x)   //输出结果:undefined
x = 666;  
console.log(x)   //输出结果:666
复制代码
  1. 全局变量 和 局部变量:
    JS中的变量分两类:全局,局部
     全局变量指变量在函数内外均可以访问
     局部变量指只能在函数内部访问
    特别注意:在JS中,全局变量和局部变量的分界点是"函数" (想了解函数的使用,能够关注我)

全局变量对象

var age = 100;
function f(){
    console.log("在函数里面访问的全局变量"+age)
}
console.log(age)                       先输出
f()            // 函数调用             后输出
复制代码

输出结果:100
     在函数里面访问的全局变量100
注:若是你要使用这个函数,那么你必定要调用这个函数,不然不起做用图片


局部变量ip

function f(){
       var name = "xiao";  // 局部变量,由于这个变量放在函数里面
       console.log(name)
   }
console.log("----"+name)     先输出
f()                          后输出
复制代码

输出结果:----
     xiao
由于这个变量放在函数里,因此为局部变量,函数外面访问不了


当局部变量 提高 时,局部变量是提高到了函数体的最前面
示例:

function f(){
    console.log(a)
    var a = 2;
}
f();  
复制代码

上面代码至关于以下代码:

function f(){  
    var a;
    console.log(a)
    a = 2;
}
f();
复制代码

console.log(); 意思是在浏览器的控制台输出

看以下代码,说出它是 全局变量 仍是 局部变量

for(var i=0; i<10; i++){
}
console.log(i)  
复制代码

答:是全局变量,缘由是全局变量和局部变量的分界点是函数

var变量不足之处:

1,提高 全局变量的提高,局部变量的提高

2,同名变量,那么后面的变量会覆盖前面的变量

3,能够省去var

....


重点重点重点,曾经踩过的坑

给出一下代码,说出结果:

(function ab() {
	var a=b=2;
	console.log(typeof a) //number
	console.log(typeof b) //number

})()
console.log(typeof a) //undefined
console.log(typeof b)
复制代码

因为 a 和 b 都定义在函数的封闭范围内,而且都始于 var关键字,大多数人都指望 typeof a 和 typeof b 在上面的例子中都是undefined

然而,事实并不是如此。这里的问题是,大多数人将语句 var a = b = 3; 错误地理解为是如下声明的简写:

var b = 3;
var a = b;
复制代码

但事实上,var a = b = 3; 实际是如下声明的简写:

b = 3;
var a = b;
复制代码

那么运行下面这段代码:

(function ab() {
	var a=b=2;
})()
console.log(b)
console.log(a)
复制代码

获得的结果是:

2
下面报错: Uncaught ReferenceError: a is not defined
复制代码

能够看出这里的a是局部变量,而b是全局变量


总结: 使用var声明变量,在这前用的比较多,在ES6出来后,又定义了两个关键字,一个叫let (能够声明块级做用域), 一个叫const 也就是说,在JS中,咱们之后尽可能使用letconst来声明变量,有的低版本浏览器,对这个letconst支持不给力(极少数)


let 的使用

若是使用了let声明的变量,那么这个变量是不会提高的

示例:

console.log(a)  
let  a = 1;  
复制代码

那么它会直接报错,而不会输出 undefined

若是使用了let声明的变量,能够防止重复声明

示例:

let a = 1;
 let a = 2;
 let a = 3;
 console.log(a) 
复制代码

那么它会直接报错

使用let能够造成一个块级做用域,一个{}就是一个块级做用域

示例:

{
     let a = 10;
     console.log(a)   输出结果:10
}
console.log(a)        输出结果:直接报错
复制代码

示例:

let a = 10;
{
     console.log(a)
     //  let a = 666;
}  
复制代码

输出结果:10 (若是把let a = 666;的注释取消,就会直接报错)
注:暂存性死区 若是你在这个块级做用域中使用let声明了一个变量,在块级做用域外面也有一个同名的变量,当你要在块级做用域中这个变量前面去访问这个变量时,那么它会这样考虑,在块级做用域中已经有了a,只不过你是访问不了的,是由于let声明的变量不能提高


若是在for循环中循环变量若是使用了let ,你能够把它看成是块级做用域中的变量,也就是说,只要出来{} i 就不能生效 。因此,之后在使用for循环的时候,不要使用var来声明一个循环变量,要使用let来声明一个循环变量

const 的使用

const 是用来声明一个 常量

示例:

const PI = 3.14
PI = 666;   若是声明了一个常量,那么这个常量的值,你是不能随便改变
console.log(PI)  
复制代码

输出结果:直接报错

const 声明的常量也是不能 提高 的

总结:

let
与var相似,用来定义变量
特色:

  • 块级做用域(第三种做用域)。let所声明的变量,只在let命令所在的代码块内有效
  • let没有“变量提高”现象
  • 不会成为window对象的属性
  • 暂存性死区(TDZ)
  • 不能重复定义

const
声明常量,值不能改变
特色:

  • 定义完后,不能修改值(多是基本数据类型,也多是地址)
  • 不能重复声明
  • 没有提高
  • 声明时必须赋值

之后能使用 let 和 const 的,就使用 let 和 const ,尽可能不要使用 var


深刻理解变量

加var和不加var的区别

  • 区别一:

局部变量 全局变量

图片加载失败!

图片加载失败!

图片加载失败!

  • 区别二:

可删除的,不可删除的

图片加载失败!

  • 区别三:

加var会提高,不加var不会被提高(参考前面的内容)

变量的做用域

  • 全局:global

  • 局部:local

  • 变量的就近原则

全局变量

图片加载失败!

局部变量

图片加载失败!

  • 块级做用域

JS中没有块级做用域

图片加载失败!

注意:只有函数可以划分做用域


^_<

相关文章
相关标签/搜索