JavaScript高级程序设计读书分享之3章——3.3变量

JavaScript高级程序设计(第4版)读书分享笔记记录

适用于刚入门前端的同志

目录

 var 关键字

1.var 声明作用域

2.var 声明提升 

let 声明

暂时性死去

全局声明

for 循环中的 let 声明

const 声明

声明风格及最佳实践


 var 关键字

  • 1.var 声明作用域

关键的问题在于,使用 var 操作符定义的变量 会成为包含它的函数的局部变量
比如,使用 var 在一个函数内部定义一个变量,就意味着该变量将在函数退出时被销毁:
function test() { 
 var message = "hi"; // 局部变量
} 
test(); 
console.log(message); // 出错!
不过,在函数内定义变量时 省略 var 操作符,可以创建一个全局变量
function test() { 
 message = "hi"; // 全局变量
} 
test(); 
console.log(message); // "hi"
注意 虽然可以通过省略 var 操作符定义全局变量,但不推荐这么做。在局部作用域中定
义的全局变量很难维护,也会造成困惑。这是因为不能一下子断定省略 var 是不是有意而
为之。在严格模式下,如果像这样给未声明的变量赋值,则会导致抛出 ReferenceError
  • 2.var 声明提升 

使用这个关键字声明的变量会 自动提升到函数作用域顶部
function foo() { 
 console.log(age); 
 var age = 26; 
} 
foo(); // undefined
之所以不会报错,是因为 ECMAScript 运行时把它看成等价于如下代码:
function foo() { 
 var age; 
 console.log(age); 
 age = 26; 
} 
foo(); // undefined
这就是所谓的“提升”(hoist ),也就是把所有变量声明都拉到函数作用域的顶部

let 声明

let var 的作用差不多,但有着非常重要的区别。 最明显的区别是,let 声明的范围是块作用域,
而 var 声明的范围是函数作用域。
if (true) { 
 let age = 26; 
 console.log(age); // 26 
} 
console.log(age); // ReferenceError: age 没有定义
    在这里,age 变量之所以不能在 if 块外部被引用, 是因为它的作用域仅限于该块内部 。块作用域
是函数作用域的子集, 因此适用于 var 的作用域限制同样也适用于 let
let 也不允许同一个块作用域中出现冗余声明。这样会导致报错
let age; 
let age; // SyntaxError;标识符 age 已经声明过了

暂时性死去

let var 的另一个重要的区别, 就是 let 声明的变量不会在作用域中被提升
// age 不会被提升
console.log(age); // ReferenceError:age 没有定义
let age = 26;

全局声明

var 关键字不同,使用 let 在全局作用域中声明的变量不会成为 window 对象的属性( var 声明的变量则会)。
var name = 'Matt'; 
console.log(window.name); // 'Matt' 
let age = 26; 
console.log(window.age); // undefined
不过, let 声明仍然是在全局作用域中发生的,相应变量会在页面的生命周期内存续

for 循环中的 let 声明

let 出现之前,for 循环定义的迭代变量会渗透到循环体外部

for (var i = 0; i < 5; ++i) { 
 // 循环逻辑 
} 
console.log(i); // 5

for (let i = 0; i < 5; ++i) { 
 // 循环逻辑
} 
console.log(i); // ReferenceError: i 没有定义

const 声明

const 的行为与 let 基本相同,唯一一个重要的区别 是用它声明变量时必须同时初始化变量,且
尝试修改 const 声明的变量会导致运行时错误
const age = 26; 
age = 36; // TypeError: 给常量赋值

// const 也不允许重复声明
const name = 'Matt'; 
const name = 'Nicholas'; // SyntaxError

// const 声明的作用域也是块
const name = 'Matt'; 
if (true) { 
 const name = 'Nicholas'; 
} 
console.log(name); // Matt
如果 const 变量引用的是一个对象,那么修改这个对象内部的属性并不违反 const 的限制。
const person = {}; 
person.name = 'Matt'; // ok

声明风格及最佳实践

不使用 var,const 优先,let 次之

猜你喜欢

转载自blog.csdn.net/weixin_42307283/article/details/129009730