首頁  >  文章  >  web前端  >  一起聊聊var、let以及const的差異(程式碼範例)

一起聊聊var、let以及const的差異(程式碼範例)

藏色散人
藏色散人轉載
2023-01-06 16:25:212087瀏覽

這篇文章為大家帶來了關於JavaScript的相關知識,其中主要為大家介紹了var、let以及const的區別有哪些,還有ECMAScript 和JavaScript的關係介紹,有興趣的朋友一起來看一下吧,希望對大家有幫助。

一起聊聊var、let以及const的差異(程式碼範例)

什麼是JavaScript?

首先,ECMAScript 和 JavaScript 什麼關係?

  • ECMAScript是一個國際通過的標準化腳本語言。
  • JavaScript由ECMAScript和DOM、BOM三者組成。可以簡單理解為:ECMAScript是JavaScript的語言規範,JavaScript是ECMAScript的實作與擴充。

var、let、const的差別?

1. var宣告變數存在變數提升,let和const不存在變數提升

console.log(a); // undefined  ===>  a已声明还没赋值,默认得到undefined值
console.log(b); // 报错:b is not defined  ===> 找不到b这个变量
console.log(c); // 报错:c is not defined  ===> 找不到c这个变量
var a = 100;	
let b = 10;
const c = 10;
console.log(a);//a=100

2. let和const只能在區塊作用域裡存取

if(1){
    var a = 100;
    let b = 10;
    const c = 1;
}

console.log(a); // 100
console.log(b)  // 报错:b is not defined  ===> 找不到b这个变量
console.log(c)  // 报错:c is not defined  ===> 找不到c这个变量

3. 同一作用域下let和const不能宣告同名變量,而var可以

var a = 100;
console.log(a); //控制台输出 100

var a = 10;
console.log(a); //控制台输出 10

let a = 100;
let a = 10;

//  控制台报错:Identifier 'a' has already been declared  ===> 标识符a已经被声明了。

4. const定義常數,而且不能修改,但是在定義的物件時物件屬性值可以改變

 const a=2
 a=3
 console.log(a)  //控制台报错
const person = {
    name : 'make',
    sex : '男'
}

person.name = 'test'

console.log(person.name)    //运行发现控制台没有报错,且 person.name 被成功修改

#? ? ? ?這是怎麼回事呢?

因為物件是引用型別的,person中保存的僅是物件的指標,而修改物件的屬性不會改變物件的指標,所以這種情況就會修改成功。也就是說const定義的引用型只要指標不改變,都是被允許的。

接下來我們試著修改指針,讓person指向一個新對象,最後果然報錯

const person = {
  name : 'make',
  sex : '男'}person = {
  name : 'test',
  sex : '男'}console.log(person.name)  //控制台报错

5. 小結

  • var定義的變數變數提升,沒有區塊的概念,可以跨區塊訪問

  • let定義的變數只能在區塊作用域存取,不能宣告同名變數。

  • const用來定義常數,使用時必須初始化(即必須賦值),不能宣告同名變量,只能在區塊作用域裡存取,而且不能修改,但是在定義的物件時物件屬性值可以改變。

  • 他們都無法跨函數存取

#推薦學習:《JavaScript影片教學

以上是一起聊聊var、let以及const的差異(程式碼範例)的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文轉載於:csdn.net。如有侵權,請聯絡admin@php.cn刪除