JS基础 （1）--- 变量提升与冻结

JS基础- - (1)

1.变量提升

使用var定义的代码，会把声明放到前面去，赋值保留在原位

var name = "dun";
function show() {
  if (false) {
    var name = "huang";
  }
  console.log(name); // undefined
}
console.log(name) // dun
show();

为什么出现这样的情况，是因为JS代码在执行之前会通过解析器解析一遍。在解析的过程中就会产生变量提升，将声明的代码放到最前面(自身作用域内)。
解析后的代码如下:

var name;
name = "dun"
function show() {
  //if里面的代码虽然没走，但是也会经过解析，name声明提升到最前，
  但是没有走赋值代码，所以打印出的是unfefined
  var name
  if (false) {
     name = "huang";
  }
  console.log(name);
}
console.log(name)
show();

当我们注释掉if语句时，就会发现打印结果不同了

var name = "dun";
function show() {
 if (false) {
    // var name = "huang";
  }
  console.log(name); // dun
}
console.log(name) // dun
show();

变量提升不是一个好的现象，所以为了代码的健壮性和稳定性，建议：
1.变量先声明再复制；
2.建议使用let/const,少使用var

2.变量冻结

Object.freeze可以冻结变量，冻结变量后，变量不可以修改了，但是不会报错，使用严格模式会报出错误。

"use strict"
const DATA = {
  url: 'https://www.baidu.com',
  port: '8080'
};
Object.freeze(DATA);
DATA.port = '443'; // Cannot assign to read only property 'port' of object '#<Object>'
console.log(DATA); // DATA的值未被修改

3. var

在函数中，使用var和不使用var声明变量是不一样的，前者是局部变量，后者是全局变量
在全局中声明变量，使用var和不使用var声明变量也有区别，前者是声明了一个作用域为全局的变量。后者是在window中添加属性。