js變量的聲明帶var與不帶的差別

變量的聲明

var fnn = 'fnn'
fx = 'fx'

console.log(fnn); // fnn
console.log(fx); // fx
console.log(window.fnn); // fnn
console.log(window.fx); // fx
console.log(window);      

如上面的代碼與圖所示

我們使用 ​

​var​

​​ 或者不使用 ​

​var​

​​ 聲明的變量都會挂載到全局的 ​

​window​

​ 對象上面

函數中的變量聲明

function flyFn () {
  var wfly = 'wfly'
  fly = 'fly'
  console.log('内部', wfly); // 内部 wfly
  console.log('内部', fly); // 内部 fly
}
flyFn()
console.log('外部', fly); // 外部 fly
console.log(window.wfly); // undefined
console.log(window.fly); // fly
console.log(window);
console.log('外部', wfly); // wfly is not defined      

如結果所示，會發現當函數運作時，函數内使用 ​

​var​

​​ 定義的變量不會挂載到全局的 ​

​window​

​​ 屬性上，

沒有用 ​​

​var​

​​ 聲明的變量挂載到了全局的 ​

​window​

​ 屬性上。

綜上所述，在函數内部聲明的變量，如果使用了 ​

​var​

​​ 聲明，那麼這個變量就是函數的内部變量，如果沒有使用 ​

​var​

​ 聲明，那麼它就是全局變量

使用 var 聲明與不使用 var 聲明的差別

var fnn = 'fnn'
fx = 'fx'

delete window.fnn
delete window.fx

console.log(window.fnn); // fnn
console.log(window.fx); // undefined      

如上代碼，會發現使用 ​

​delete​

​​ 後，​

​var​

​ 定義的變量并沒有被删除，而沒有使用 var 定義的變量被删除了。

這就可以了解為使用 var 定義的全局變量，它的屬性描述符 ​

​configurable​

​​ 是 ​

​false​

​，也就是不可配置，不可删除

Object.defineProperty(window, 'fnn', {
  value: '我是 fnn',
  configurable: false
});
delete fnn
console.log(fnn);

Object.defineProperty(window, 'wfly', {
  value: '我是 wfly',
  configurable: true
});
delete wfly
console.log(wfly);