JS：定义变量的var、let有何操作？（360°无死角）

进入我的主页，查看更多JS的分享！
我的代码有多短，本篇内容就有多短！

最近话不多，直接看代码和结果好伐？

一、var

定义：

//一般情况
var word = "Hello World";
console.log(word);
//输出：Hello World

//变量提升？
console.log(word);
var word = "Hello World";
//输出：undefined

//变量提升！
word = "哈哈哈";
console.log(word);
var word = "Hello World";
//输出：哈哈哈

//所谓的全局变量，已经在window对象上了
var word = "Hello World";
console.log(window.word);
//输出：Hello World

//不写var
word = "Hello World";
console.log(word);
console.log(window.word);
//输出：
//Hello World
//Hello World

函数：

//一般情况
var word = "Hello World";
function PLAYFULHD() {
  console.log(word);
}
PLAYFULHD();
//输出：Hello World

//变量提升？
PLAYFULHD();
var word = "Hello World";
function PLAYFULHD() {
  console.log(word);
}
//输出：undefined

//变量提升？
PLAYFULHD();
function PLAYFULHD() {
  console.log(word);
}
var word = "Hello World";
//输出：undefined

//变量提升！
word = "嘿嘿嘿";
PLAYFULHD();
function PLAYFULHD() {
  console.log(word);
}
var word = "Hello World";
//输出：嘿嘿嘿

//不写var
word = "Hello World";
function PLAYFULHD() {
    var word = "嘿嘿嘿";
    console.log(word);
}
PLAYFULHD();
console.log(word);
//输出：
//嘿嘿嘿
//Hello World

重复定义：

//重复定义1
var word = "Hello World";
console.log(word);
var word = "哦吼吼";
console.log(word);
//输出：
//Hello World
//哦吼吼

//重复定义2
var word = "Hello World";
console.log(word);
function PLAYFULHD() {
    var word = "哦吼吼";
    //let word = "哦吼吼"; //效果一样
    console.log(word);
}
PLAYFULHD();
console.log(word);
//输出：
//Hello World
//哦吼吼
//Hello World

总结：

• 全局变量：指变量在函数外定义， 网页中所有脚本和函数均可使用；当页面关闭后销毁
• 局部变量：指变量在函数内定义，重复定义了相同的变量并不改变全局变量的值；当函数执行结束后销毁；
• 变量提升？只要存在赋值的操作，就能直接使用，其实可以理解为默许了没有var就可以定义变量；
• 一般在定义全局变量时，放在script标签下的最前面，且局部变量的命名不和全局变量重复；
• 对于数组和对象，和原始类型的情况不一样，下面是执行代码：（数组和对象的情况类似）

//正常情况
arr = ["HHHH"];
console.log(arr);
var arr = ["哈哈哈", "嘿嘿嘿", "哦吼吼"];
//输出：["HHHH"]

//直接报错
arr[0] = "HHHH";
console.log(arr);
var arr = ["哈哈哈", "嘿嘿嘿", "哦吼吼"];
//输出：Uncaught TypeError: Cannot set property '0' of undefined

二、let

必须先定义，再使用；其它情况同var

//直接报错
word = "哈哈哈";
console.log(word);
let word = "Hello World";
//输出：Uncaught ReferenceError: Cannot access 'word' before initialization

//不绑定到window
let word = "Hello World";
console.log(word);
console.log(window.word);
//Hello World
//undefined

三、总结

• var是全局变量，在window对象上可以访问到
• var：定义时可以不加，直接进行赋值操作
• let：定义的语句必须先声明，否则报错；不在window对象上
• 局部定义的变量，即函数内，在执行完毕后就销毁，注意匿名函数也是如此
• const与let相似，定义的语句必须先声明

有补充请在评论区留言。