Javascript_关于变量的总结

Posted 2021-06-26 akyna-zh

一.变量作用域问题

1.局部变量

变量在函数内var声明变量，变量为局部作用域。
局部变量：只能在函数内部访问。

// 此处不能调用 carName 变量
function myFunction() {
    var carName = "Volvo";
    // 函数内可调用 carName 变量
}

2.全局变量

变量在函数外var声明变量，即为全局变量。
全局变量有 全局作用域: 网页中所有脚本和函数均可使用。

var carName = " Volvo";
// 此处可调用 carName 变量
function myFunction() {
    // 函数内可调用 carName 变量
}

如果变量在函数内没有声明（没有使用 var 关键字），该变量为全局变量。

以下实例中 carName 在函数内，但是为全局变量。
实例
// 此处可调用 carName 变量
function myFunction() {
    carName = "Volvo";
    // 此处可调用 carName 变量
}

二.变量声明提升

javascript 中，函数及变量的声明都将被提升到函数的最顶部。
JavaScript 中，变量可以在使用后声明，也就是变量可以先使用再声明。

x = 5; // 变量 x 设置为 5

elem = document.getElementById("demo"); // 查找元素
elem.innerhtml = x;                     // 在元素中显示 x

var x; // 声明 x 

三.变量初始化不提升

JavaScript 只有声明的变量会提升，初始化的不会。

var x = 5; // 初始化 x

elem = document.getElementById("demo"); // 查找元素
elem.innerHTML = x + " " + y;           // 显示 x 和 y

var y = 7; // 初始化 y

y -> undifined

四.块级作用域

使用 var 关键字声明的变量不具备块级作用域的特性，它在 {} 外依然能被访问到。

{ 
    var x = 2; 
}
// 这里可以使用 x 变量

let 声明的变量只在 let 命令所在的代码块 {} 内有效，在 {} 之外不能访问。

{ 
    let x = 2;
}
// 这里不能使用 x 变量

let_eg:

var x = 10;
// 这里输出 x 为 10
{ 
    let x = 2;
    // 这里输出 x 为 2
}
// 这里输出 x 为 10

五.关于let

1.使用 let 关键字声明的全局作用域变量不属于 window 对象:

var x = 2;
window.x
2
let y = 2;
window.y
undefined

2.let 不具备变量提升

// 在这里不可以使用 carName 变量

let carName;

3.在相同的作用域中，不能使用 let 关键字来重置 let 关键字声明的变量:

let x = 2;       // 合法
let x = 3;       // 不合法

六.关于const

1.const 声明的常量必须初始化：

// 错误写法
const PI;
PI = 3.14159265359;

// 正确写法
const PI = 3.14159265359;

2.使用 const 定义的对象属性可变

// 创建常量对象
const car = {type:"Fiat", model:"500", color:"white"};
 
// 修改属性:
car.color = "red";
 
// 添加属性
car.owner = "Johnson";

但是我们不能对常量对象重新赋值：

const car = {type:"Fiat", model:"500", color:"white"};
car = {type:"Volvo", model:"EX60", color:"red"};    // 错误

3.使用const定义的数组个体可变

// 创建常量数组
const cars = ["Saab", "Volvo", "BMW"];
 
// 修改元素
cars[0] = "Toyota";
 
// 添加元素
cars.push("Audi");

但是我们不能对常量数组重新赋值：

const cars = ["Saab", "Volvo", "BMW"];
cars = ["Toyota", "Volvo", "Audi"];    // 错误

4.const同样不具备变量提升

5.const 关键字在不同作用域，或不同块级作用域中是可以重新声明赋值的:

const y = 3;
{
  const y =4;
}
y
3

const x = 3;
x = 4;
Uncaught TypeError: invalid assignment to const 'x'
    <anonymous> debugger eval code:2

七.锁死变量

const 定义的变量并非不可改变，比如使用const声明对象，可以改变对象值。可以使用Object.freeze()方法来 冻结变量 ，如：

const obj = {
  name:"1024kb"
}
Object.freeze(obj)
// 此时对象obj被冻结，返回被冻结的对象

需要注意的是，被冻结后的对象不仅仅是不能修改值，同时也

1.不能向这个对象添加新的属性
2.不能修改其已有属性的值
3.不能删除已有属性
4.不能修改该对象已有属性的可枚举性、可配置性、可写性

参考：https://www.runoob.com