JavaScript学习笔记——变量、作用域、var、const和let
JavaScript学习笔记——变量、作用域、var、const和let
- 学习链接（原链接）
- 变量
-
- 变量声明的三种方式
- 作用域
-
- 作用域介绍
- 作用域分类
-
- 全局作用域
- 局部作用域（函数作用域）
- 块级作用域
- 块级作用域和局部(函数)作用域区别
- var
-
- var的作用域(全局+函数)
- var变量的重新声明与修改
- var变量提升
- JS里面使用var声明变量存在的三个问题
- const
-
-
- 三级目录
-
学习链接（原链接）
菜鸟教程
let和const与var的区别
js中var、let、const的区别
JS里面使用var声明变量存在的三个问题
在JavaScript中，if 语句是/有 块级作用域吗？
JS IF 作用域
JavaScript的三座大山–(2)–作用域和闭包（牛牛牛牛牛）
变量
变量：存储信息的容器
可存放：值or表达式
命名规则：
以字母开头
以$或_开头（不推荐）
大小写敏感
变量声明的三种方式
变量声明的三种方式：var、let、const
作用域
作用域介绍
作用域：一个变量或者函数的有效作用范围
作用域分类
在JS中作用域一共有三种，分别是全局作用域、局部作用域（函数作用域）、块级作用域；
全局作用域
全局作用域：
1、声明在函数外部的变量（声明在script标签中的变量和函数），在代码中任何地方都能访问到的对象拥有全局作用域；
var和let变量在全局作用域中都是全局变量；
注意：所有末定义直接赋值的变量自动声明为拥有全局作用域
最外层函数和在最外层函数外面定义的变量拥有全局作用域
2、全局作用域中声明的变量和函数会作为window对象的属性和方法保存，可以通过 window.变量名 去调用它；
3、全局作用域在页面打开时被创建，页面关闭时被销毁；
（1）最外层函数和在最外层函数外面定义的变量拥有全局作用域，例如：
var authorName="波妞";
function doSomething(){
var blogName="中介";
function innerSay(){
console.log(blogName);
}
innerSay();
}
console.log(authorName); //波妞
doSomething(); //中介
console.log(blogName); //错误
innerSay() //错误
（2）所有未定义直接赋值的变量自动声明为拥有全局作用域，例如：
function doSomething(){
var authorName="波妞";
blogName="中介";
console.log(authorName);
}
doSomething(); // 波妞
console.log(blogName); //中介
console.log(authorName); //错误
局部作用域（函数作用域）
在函数中用 var 、let 、const 声明的所有变量，都是函数的局部变量，作用范围为局部作用域，
即：只能在函数内部使用，函数外部使用是不行的。无论是通过var还是let定义在局部作用域的变量都是局部变量；
1、调用函数时，函数作用域被创建；函数执行完毕，函数作用域被销毁；
2、每调用一次函数就会创建一个新的函数作用域，他们之间是相互独立的；
3、在函数作用域中可以访问到全局作用域的变量，在函数外无法访问到函数作用域内的变量；
4、在函数作用域内访问变量/函数时，会先在自身作用域中查找，若没有找到，则会到函数的上一级作用域中寻找，一直到全局作用域；
块级作用域
任何一对花括号｛ ｝中的语句集都属于一个块
在这之中定义的所有变量在代码块外都是不可见的，我们称之为块级作用域。
在ES6中只要 { } 没有和函数结合在一起，那么就是“块级作用域”。
ES6之前没有块级作用域。
使用 let 关键字或者 const 关键字来实现块级作用域。
let 和 const声明的变量只在 let 或 const命令所在的代码块 { } 内有效，在 { } 之外不能访问。
！！！！！注意：
块级作用域中，var定义的变量是全局变量，let定义的变量是局部变量；
块作用域由 { } 包括，if语句和for语句里面的{ }也属于块作用域
但函数funtion(){ }里面的{ }不属于块级作用域，而是局部作用域(函数作用域)；
块级作用域和局部(函数)作用域区别
在块级作用域中通过var定义的变量是全局变量
{
//块级作用域
var num = 123;//全局变量
}
console.log(num); // 123
在局部作用域中通过var定义的变量是局部变量
function test() {
var value = 666;//局部变量
console.log(value);
}
test(); // 666
console.log(value);//value is not defined
无论是在块级作用域还是局部作用域，省略变量前面的let或者var就会变成一个全局变量。
{
var num1 = 678;//全局变量
num2 = 678;//全局变量
let num3 = 678;//局部变量
}
console.log(num1);//678
console.log(num2);//678
console.log(num3);//num3 is not defined
function f() {
num1 = 456;//全局变量
var num2 = 678;//局部变量
let num3 = 123;//局部变量
}
f();
console.log(num1);//456
console.log(num2);//num2 is not defined
console.log(num3);//num3 is not defined
var
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>JS--var、let、const</title>
</head>
<body>
<script>
var x = 1;
var y = 2;
var z = x + y;
document.write(x + "
");
document.write(y + "
");
document.write(z + "
");
</script>
</body>
</html>
JavaScript——document.write
var的作用域(全局+函数)
var可以在全局范围声明或函数/局部范围内声明。
示例：
var smytest = "smy"; //全局范围
function newFunction(){
var smytest2 = "inner";
console.log(smytest2);
}
console.log(smytest); //输出：smy
newFunction(); //调用函数,输出：inner
console.log(smytest2); //输出：ReferenceError: smytest2 is not defined
var变量的重新声明与修改
var变量可以在相同的作用域内被重新声明和修改
var smytest = "smy"; //全局范围
var smytest = "fighting"; //相同作用域下重新声明
smytest = "emo"; //相同作用域下修改
function newFunction(){
var smytest2 = "inner";
var smytest2 = "outer"; //相同作用域下重新声明
console.log(smytest2);
}
console.log(smytest); //输出：emo
newFunction(); //调用函数,输出：outer
var变量提升
JavaScript 的一种机制:在执行代码之前，变量和函数声明会移至其作用域的顶部
console.log(greeter);
var greeter = 'say hello';
代码会被解释为:
var greeter;
console.log(greeter); // greeter is undefined
greeter = 'say hello';
var声明的变量会被提升到其作用域的顶部，并使用 undefined 值对其进行初始化
JS里面使用var声明变量存在的三个问题
1、允许重复声明，导致变量被覆盖
假设你var a = 2前面还有上万行代码，那么你调用prinf函数的时候，是想打印之前的a,但是你忘记之前声明的变量和几万行代码后面的a是同名的，导致后面声明的a覆盖了之前的a.
2、变量提升：闭包问题，怪异的数据访问.
if(Math.random() > 0.5){
var a = "abc";
console.log("if方法1" + a);
}else{
console.log("if方法2" + a);
}
console.log("最外层" + a);
//输出：
//if方法2undefined
//最外层undefined