JavaScript基礎(chǔ)系列---變量及其值類型

sugarmo 發(fā)布于2019-08-22 17:19 / 335人閱讀

摘要：但對于引用類型的數(shù)據(jù)主要是對象和數(shù)組，變量指向的內(nèi)存地址，保存的只是一個引用地址指針，只能保證這個引用地址指針是固定的，至于它指向的堆內(nèi)存中的存儲的值是不是可變的，就完全不能控制了。

基礎(chǔ)概念

變量是存儲信息的容器，這里需要區(qū)分一下：變量不是指存儲的信息本身，而是指這個用于存儲信息的容器，可以把變量想象成一個個用來裝東西的紙箱子

變量需要聲明，并且建議在聲明的同時進行初始化，如下所示：

var aa = "1";
let bb = 2;
const CC = 3;

如果重新聲明變量，該變量的值不會丟失

var aa = "cc";
var aa; //此時的值還是cc

變量名（標(biāo)志符）命名要求：

適用于變量/屬性/函數(shù)/函數(shù)參數(shù)的名字等

可由字母、數(shù)字、下劃線_及美元符$組成

不可以使用關(guān)鍵字、保留字以及true、false、null、(eval、arguments嚴格模式下)

使用undefined雖然不會報錯，但是并不能聲明成功，無論給它初始化為什么，它的值仍然為undefined

最好使用字母開頭（還可以使用_與$）

值類型

變量可能包含兩種不同數(shù)據(jù)類型的值：基本類型值（簡單的數(shù)據(jù)段）和引用類型值（可能由多個值構(gòu)成的對象）

因為所有引用類型的值都是Object的實例，所以可以使用 xx instanceof Object 來判斷是否為引用類型的值，如果是則會返回true，否則返回false

存儲方式

基本類型值在內(nèi)存中占據(jù)固定大小空間，因此被保存在棧內(nèi)存中（棧由操作系統(tǒng)自動分配釋放）；

引用類型值是對象，保存在堆內(nèi)存中；（堆：一般由程序員分配釋放，若程序員不釋放，程序結(jié)束時可能由OS回收）

訪問方式

對于基本類型，變量存儲的是具體的值，可以按值訪問，直接操作存儲的值

對于引用類型，變量存儲的是對象引用地址（指針），是按引用訪問，當(dāng)查詢時，我們需要先從棧中讀取存儲的內(nèi)存地址，然后再順藤摸瓜地找到保存在堆內(nèi)存中的值

復(fù)制變量值

復(fù)制時，基本類型拷貝的是具體的值，而引用類型拷貝的是引用地址，所以引用類型賦值時要格外注意?。?！

//基本類型賦值
var num1 = 10;
var num2 = num1;
console.log(num1,num2);// 10, 10
num2 = 100;
console.log(num1,num2);// 10, 100

//引用類型賦值
//person2拷貝了person1的引用地址，所以person1和person2實際上指向的是同一個對象
//所以改變person2會影響到person1
var person1 = {
    name:"cc"
};
var person2 = person1;
console.log(person1.name, person2.name);// cc, cc
person2.name = "cshine";
console.log(person1.name, person2.name);// cshine, cshine

var arr1 = [1,2,3];
var arr2 = arr1;
console.log(arr1, arr2);// [1, 2, 3], [1, 2, 3]
arr2[1]= "string";
console.log(arr1, arr2);// [1, "string", 3], [1, "string", 3]

傳遞參數(shù)

ECMAScript中所有的函數(shù)的參數(shù)都是按值傳遞，即使是引用類型值的傳遞也是按值傳遞

傳遞基本類型值時，被傳遞的值會被復(fù)制給一個局部變量（即命名參數(shù)或者arguments中的一個元素）

傳遞引用類型值時，引用類型值是一個引用地址（指針），它也會復(fù)制給一個局部變量，這個局部變量再根據(jù)這個地址去按引用訪問對象，因此這個局部變量的變化會反映在函數(shù)的外部。所以還是按值傳遞，而不是因為它是按引用傳遞才導(dǎo)致局部變量的變化會反映在函數(shù)的外部

注意點

es6新增了let和const命令用來聲明變量

let命令，它的用法類似于var，但是所聲明的變量，只在let命令所在的塊級作用域內(nèi)有效，且在該塊級作用域內(nèi)不可重復(fù)聲明

const聲明一個只讀的常量,一旦聲明，常量的值就不能改變，與let一樣，只在聲明所在的塊級作用域內(nèi)有效，且在該塊級作用域內(nèi)不可重復(fù)聲明

const實際上保證的，并不是變量的值不得改動，而是變量指向的那個內(nèi)存地址不得改動。對于簡單類型的數(shù)據(jù)（數(shù)值、字符串、布爾值），值就保存在變量指向的那個內(nèi)存地址，因此等同于常量。但對于引用類型的數(shù)據(jù)（主要是對象和數(shù)組），變量指向的內(nèi)存地址，保存的只是一個引用地址（指針），const只能保證這個引用地址（指針）是固定的，至于它指向的堆內(nèi)存中的存儲的值是不是可變的，就完全不能控制了。因此，將一個對象聲明為常量必須非常小心。

未使用var/let/const進行聲明，此時創(chuàng)建的變量為全局變量，盡量不要這樣做！

var命令和function命令聲明的全局變量，是頂層對象的屬性，let命令、const命令、class命令聲明的全局變量，不屬于頂層對象的屬性（瀏覽器中為window，node中為global）

對于var/let來說，只聲明而未初始化，此時變量存儲的信息是“空”的，也就是undefined；但是對于const來說，只聲明而不進行初始化是不允許的，會拋出Missing initializer in const declaration的錯誤，因為const定義的是常量，一旦定義便不可更改。

聲明提升（hoisting）

var命令聲明的變量會發(fā)生”聲明提升“現(xiàn)象，即變量可以在聲明之前使用，值為undefined；

console.log(aa);// undefined
var aa = "string";
console.log(aa);// string

function聲明的函數(shù)也會發(fā)生”聲明提升“現(xiàn)象，函數(shù)在聲明之前可以使用，值為指向該函數(shù)的指針；但是如果是在支持ES6的環(huán)境中，ES6允許在塊級作用域內(nèi)聲明函數(shù)，此時在塊級作用域中聲明的函數(shù)，會提升到所在的塊級作用域的頭部，值為整個函數(shù)塊，同時還會提升到塊級作用域外，但是值為undefined。（環(huán)境導(dǎo)致塊級作用域內(nèi)聲明函數(shù)的行為差異非常大，所以應(yīng)該避免在塊級作用域內(nèi)聲明函數(shù)。如果確實需要，也應(yīng)該寫成函數(shù)表達式，而不是函數(shù)聲明語句）

console.log(fn);// ? fn(){}
function fn(){}
console.log(fn);// ? fn(){}

//支持es6的環(huán)境中
console.log(fb);// undefined
if(true){
    console.log(fb); // ? fb(){}
    function fb(){}
}
console.log(fb);// ? fb(){}

console.log(fc);// undefined
if(false){
    console.log(fc); // 未執(zhí)行
    function fc(){}
}
console.log(fc);// undefined
fc() //Uncaught TypeError: fc is not a function

函數(shù)和變量都會聲明提升，此時若函數(shù)名和變量名同名，函數(shù)名的優(yōu)先級要高；但是正式執(zhí)行代碼時，同名函數(shù)會覆蓋只聲明卻未賦值的變量，但是它不能覆蓋聲明且賦值的變量(原因分析可見另一篇文章JavaScript基礎(chǔ)系列---執(zhí)行環(huán)境與作用域鏈)

console.log(bb);// ? bb(){}
var bb;
function bb(){}
console.log(bb);// ? bb(){}


console.log(cc);// ? cc(){}
var cc = "string";
function cc(){}
console.log(c)c;// string

局部變量/函數(shù)（函數(shù)作用域function塊里面的變量/函數(shù)）也會聲明提升，可以先使用后聲明，不影響外部同名變量/函數(shù)

let和const命令改變了語法行為，它們所聲明的變量一定要在聲明后使用，否則報錯。由于let和const命令在當(dāng)前塊級作用域內(nèi)不可重復(fù)聲明所以當(dāng)有同名函數(shù)時，會直接報錯Identifier xx has already been declared

參考資料

《JavaScript高級程序設(shè)計第三版》

ECMAScript 6 入門

MDN變量

GPU云服務(wù)器云服務(wù)器 javascript值類型 javascript專題系列 javascript深入系列兩個變量交換值

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/95063.html

發(fā)表評論

登陸后可評論

0條評論

sugarmo

男|高級講師

我要關(guān)注我要私信

TA的文章

千呼萬喚，web人臉識別登錄完整版來了，這樣式我愛了

閱讀 2929·2021-11-25 09:43
華納云為您介紹GPU服務(wù)器的5種虛擬化技術(shù)

閱讀 2375·2021-11-24 09:39
Vmshell：香港CMI線路，200M帶寬月付9刀，300M帶寬月付18刀，解鎖全部流媒體

閱讀 2765·2021-09-23 11:51
TudCloud：香港vps/國內(nèi)優(yōu)化/512MB內(nèi)存/5GB SSD空間/300GB流量/50Mb

閱讀 1440·2021-09-07 10:11
Android 開源SlideSwitch源碼分析

閱讀 1483·2019-08-27 10:52
javascript-面向?qū)ο?Function類型

閱讀 1964·2019-08-26 12:13
React16事件機制徹底解讀

閱讀 3387·2019-08-26 11:57
知乎書籍排行網(wǎng)站——建站始末

閱讀 1422·2019-08-26 11:31

成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

上云采購季！| 2核2G4M爆款云服務(wù)器低至59元/年，更有多臺、長期優(yōu)惠，快來選購！

JavaScript基礎(chǔ)系列---變量及其值類型

相關(guān)文章

JavaScript基礎(chǔ)系列---閉包及其應(yīng)用

**【重溫基礎(chǔ)】22.內(nèi)存管理**

JavaScript 是如何工作的：JavaScript 的內(nèi)存模型

**前端每周清單半年盤點之 JavaScript 篇**

JavaScript 是如何工作的：JavaScript 的共享傳遞和按值傳遞

發(fā)表評論

0條評論

sugarmo

男|高級講師

TA的文章

千呼萬喚，web人臉識別登錄完整版來了，這樣式我愛了

華納云為您介紹GPU服務(wù)器的5種虛擬化技術(shù)

Vmshell：香港CMI線路，200M帶寬月付9刀，300M帶寬月付18刀，解鎖全部流媒體

TudCloud：香港vps/國內(nèi)優(yōu)化/512MB內(nèi)存/5GB SSD空間/300GB流量/50Mb

Android 開源SlideSwitch源碼分析

javascript-面向?qū)ο?Function類型

React16事件機制徹底解讀

知乎書籍排行網(wǎng)站——建站始末

最新活動

資訊專欄INFORMATION COLUMN

上云采購季！| 2核2G4M爆款云服務(wù)器低至59元/年，更有多臺、長期優(yōu)惠，快來選購！

JavaScript基礎(chǔ)系列---變量及其值類型

相關(guān)文章

發(fā)表評論

0條評論

男|高級講師

TA的文章

最新活動

上云采購季！| 2核2G4M爆款云服務(wù)器低至59元/年，更有多臺、長期優(yōu)惠，快來選購！