文章已同步至掘金:https://juejin.cn/post/6844903847622606862
欢迎访问😃,有任何问题都可留言评论哦~
- 变量的定义: 变量是指程序中一个已经命名的储存单位,它的主要作用就是为数据操作提供存放信息的容器。
- 变量的命名:
- 必须以字母或下划线(_)开头,中间可以是数字、字母或下划线;
- 变量名不能包括空格、加、减等符号;
- 不能使用JS中关键字作为变量名,如int,new等;
- JS的变量名严格区分大小写;
- 变量的声明与赋值:
在JS中,var
就是专门用来声明变量的;
声明一个变量
var 变量名;
如果仅仅是声明一个变量,不对变量进行赋值,那么这个变量是有默认值(undefined)
如:var x; 输出就是 undefined
注:一个 var 可以同时声明多个变量,中间用逗号隔开。 如:var x,y,z;
定义一个变量
var x=1;
对变量进行声明的时候,同时为变量进行赋值,对变量"x"的操作,本质就是对数值"1"的操作
注:声明变量的同时,也可以对多个变量进行赋值。如:var x=1,y=2,z=3;
注:如果对同一个变量进行多次赋值,那么后者将覆盖前者。
如:var x=1;
var x=2;
那么"x"的值最终为"2"
使用 var 声明的变量可以进行提升 。提升就是把加 var 的变量提到代码的最前面。因为JS代码在执行之前有一个预解析,预解析的时候做了两件事,把加var的变量提升,把函数提升。
一个script标签就是一个代码段。预解析完后,才会执行JS代码
提升的时候仅仅是提升了声明
如:console.log(x) //输出结果:undefined var x = 666; console.log(x) //输出结果:666
上面代码相当于如下代码:
var x; console.log(x) //输出结果:undefined x = 666; console.log(x) //输出结果:666
- 全局变量 和 局部变量:
JS中的变量分两类:全局,局部
全局变量指变量在函数内外都可以访问
局部变量指只能在函数内部访问
特别注意:在JS中,全局变量和局部变量的分界点是"函数" (想了解函数的使用,可以关注我)
全局变量
var age = 100; function f(){ console.log("在函数里面访问的全局变量"+age) } console.log(age) 先输出 f() // 函数调用 后输出
输出结果:100
在函数里面访问的全局变量100
注:如果你要使用这个函数,那么你一定要调用这个函数,否则不起作用
局部变量
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中,我们以后尽量使用let
或const
来声明变量,有的低版本浏览器,对这个let
和const
支持不给力(极少数)
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中没有块级作用域
注意:只有函数能够划分作用域
评论区