JS中的undefined 與 null

来源:https://www.cnblogs.com/ronaldo9ph/archive/2023/05/23/17422449.html
-Advertisement-
Play Games

在 JavaScript 中, undefined 和 null 是兩個特殊的值,用於表示缺失或空值。 undefined 是一個表示未定義或未賦值的原始值。它在以下情況下使用: 1. 變數聲明瞭但未初始化時,預設為 undefined 。 let x; console.log(x); // und ...


在 JavaScript 中, undefined 和 null 是兩個特殊的值,用於表示缺失或空值。



undefined 是一個表示未定義或未賦值的原始值。它在以下情況下使用:

1. 變數聲明瞭但未初始化時,預設為 undefined 。

let x;
console.log(x); // undefined

 

 

2. 訪問對象屬性或數組元素時,如果該屬性或元素不存在,則返回 undefined 。

let obj = { name: "John", age: 30 };
console.log(obj.address); // undefined

let arr = [1, 2, 3];
console.log(arr[3]); // undefined

 


3. 函數沒有明確返回值時,預設返回 undefined 。

 

function foo() {
// 沒有明確返回值
}

console.log(foo()); //undefined

 



相比之下, null 是一個表示空值或沒有對象引用的特殊值。它通常由程式員顯式賦予變數或屬性,表示該值為空。例如:

let x = null;
console.log(x); // null

 


null 主要用於以下情況:

1. 初始化一個變數,以便稍後將其設置為對象。

let obj = null; // 初始化為 null
obj = { name: "John", age: 30 }; // 後續設置為對象

 

2. 表示函數的參數不具有對象引用。

function foo(arg) {
  if (arg === null) {
    console.log("參數為空");
  } else {
    console.log("參數不為空");
  }
}

foo(null); // 參數為空
foo("Hello"); // 參數不為空

 


需要註意的是, undefined 和 null 是不同的類型。 undefined 是一個類型為 undefined 的值,而 null 是一個類型為 object 的值。然而,在相等性比較( == 或 === )中,它們是相等的,因為它們都表示著相同的含義——空值。

console.log(undefined == null); // true
console.log(undefined === null); // false

 


在編程中,通常使用 undefined 來表示未定義或未賦值的狀態,使用 null 來表示有意地將一個值設置為空。



當涉及到 undefined 和 null 的更多細節時,還有一些要註意的事項:

1. 類型檢查

- 使用 typeof 操作符檢查 undefined 值時,會返回字元串 "undefined" 。
- 使用 typeof 操作符檢查 null 值時,會返回字元串 "object" 。這是一個歷史遺留問題, null 被錯誤地標識為對象類型。

let x;
console.log(typeof x); // "undefined"

let y = null;
console.log(typeof y); // "object"

 

2. 預設參數值

- 當函數的參數沒有傳遞或傳遞的值為 undefined 時,可以使用預設參數值。
- 當函數的參數傳遞 null 值時,會將 null 視為有效值,而不會觸發預設參數值。

function foo(x = "default") {
    console.log(x);
}

foo(); // "default"
foo(undefined); // "default"
foo(null); // null

 

3. 安全導航操作符

- 使用安全導航操作符( ?. )可以避免訪問對象屬性或調用方法時出現 undefined 或 null 的錯誤。如果屬性或方法不存在,則會返回 undefined 。

let obj = { name: "John", address: { city: "New York" } };

console.log(obj.address?.city); // "New York"
console.log(obj.address?.zipCode); // undefined

 

4. 變數賦值:

- 在變數賦值時, undefined 被視為一個變數可以接收的有效值。
- 而 null 被視為一個特殊值,通常用於表示空或未定義的狀態。

let x = undefined;
console.log(x); // undefined

let y = null;
console.log(y); // null

 

 


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 你是否在春節只能複製別人的祝福簡訊來發送?你是否在節日期間為給朋友送祝福無從下手?你是否在特殊日子和朋友打不開對話的開頭?其實,很多情況下我們都需要一堆不同與別的人祝福語,用在節日上、用在交際上等日常備用。今天這一份數據就是祝福語大全,有節日、祝福兩大類,子分類有50多個。 節日大類包含:除夕(22 ...
  • 雖然已經有很多詩詞類的資料庫,最近又再次找了一下古詩詞類的數據,又發現了一些,可是真的是各有各的優點,各有各的特色,之後不再重找詩詞類的數據了。 今天這個詩詞鑒賞數據也不錯,有分類TAG,也有譯文、註釋、品析、朝代,但是又有些不足,詳見下麵說明: 朝代記錄統計:金朝(15)、近代(8)、兩漢(143 ...
  • 這是從一個中藥大全查詢系統中破解提取出來的中藥驗方大全,整理出了數以萬計的各家經方、時方、驗方以及秘方的用藥方劑組成,用法用量以及每組方劑的功效性能、主治應用等。有了這樣一套完善的醫學資料你可以節省很多查閱資料的時間可以更方便快捷的查閱你需要的信息。 加味涼血退斑湯 組成:鮮生地30克,鮮蘆根30克 ...
  • 中國出海中東和北非地區的策略類手游《蘇丹的復仇》(Revenge of Sultans,ROS)和華為HMS生態深度合作,為本地用戶帶來創新游戲體驗,成為當地廣受歡迎的游戲之一,下載量居應用市場前列。2023年5月10日,在阿聯酋迪拜舉辦的HUAWEI P60系列及旗艦產品發佈會中,ONEMT中東G ...
  • 本文主要介紹在業務複雜化背景下,京東零售購物車團隊努力踐行工匠精神,通過全非同步化改造提升系統性能、提升用戶體驗。通過本文,讀者可以瞭解購物車中台進行全非同步化改造的總體方案,以及方案落地過程中遇到的問題及解決方法,讀者可重點關註文中提到的多分頁並行後,分頁精細控制及底層RPC異常信息問題。 ...
  • 這裡給大家分享我在網上總結出來的一些知識,希望對大家有所幫助 avaScript中有些API可能使用率比較低,下麵我們逐一介紹它們的用法和使用場景。 至於標題,主要是想讓你進來看看,兄弟們別打我! Blob API Blob API 用於處理二進位數據,可以方便地將數據轉換為Blob對象或從Blob ...
  • ## n 如果在我的電腦上已經安裝了nodejs,但是覺得這個版本不好用,或者是不相容公司的項目,那麼可以使用n進行node的版本管理。n相對於nvm來說,安裝起來還是非常方便的。 ## 安裝 #### 1. 首先確定nodejs版本,確定已安裝nodejs ``` node -v ``` #### ...
  • Deferred Components,官方實現的Flutter代碼動態下發的方案。本文主要介紹官方方案的實現細節,探索在國內環境下使用Deferred Components,並且實現了最小驗證demo。讀罷本文,你就可以實現Dart文件級別代碼的動態下發。 ...
一周排行
    -Advertisement-
    Play Games
  • 一個自定義WPF窗體的解決方案,借鑒了呂毅老師的WPF製作高性能的透明背景的異形視窗一文,併在此基礎上增加了滑鼠穿透的功能。可以使得透明窗體的滑鼠事件穿透到下層,在下層窗體中響應。 ...
  • 在C#中使用RabbitMQ做個簡單的發送郵件小項目 前言 好久沒有做項目了,這次做一個發送郵件的小項目。發郵件是一個比較耗時的操作,之前在我的個人博客裡面回覆評論和友鏈申請是會通過發送郵件來通知對方的,不過當時只是簡單的進行了非同步操作。 那麼這次來使用RabbitMQ去統一發送郵件,我的想法是通過 ...
  • 當你使用Edge等瀏覽器或系統軟體播放媒體時,Windows控制中心就會出現相應的媒體信息以及控制播放的功能,如圖。 SMTC (SystemMediaTransportControls) 是一個Windows App SDK (舊為UWP) 中提供的一個API,用於與系統媒體交互。接入SMTC的好 ...
  • 最近在微軟商店,官方上架了新款Win11風格的WPF版UI框架【WPF Gallery Preview 1.0.0.0】,這款應用引入了前沿的Fluent Design UI設計,為用戶帶來全新的視覺體驗。 ...
  • 1.簡單使用實例 1.1 添加log4net.dll的引用。 在NuGet程式包中搜索log4net並添加,此次我所用版本為2.0.17。如下圖: 1.2 添加配置文件 右鍵項目,添加新建項,搜索選擇應用程式配置文件,命名為log4net.config,步驟如下圖: 1.2.1 log4net.co ...
  • 之前也分享過 Swashbuckle.AspNetCore 的使用,不過版本比較老了,本次演示用的示例版本為 .net core 8.0,從安裝使用開始,到根據命名空間分組顯示,十分的有用 ...
  • 在 Visual Studio 中,至少可以創建三種不同類型的類庫: 類庫(.NET Framework) 類庫(.NET 標準) 類庫 (.NET Core) 雖然第一種是我們多年來一直在使用的,但一直感到困惑的一個主要問題是何時使用 .NET Standard 和 .NET Core 類庫類型。 ...
  • WPF的按鈕提供了Template模板,可以通過修改Template模板中的內容對按鈕的樣式進行自定義。結合資源字典,可以將自定義資源在xaml視窗、自定義控制項或者整個App當中調用 ...
  • 實現了一個支持長短按得按鈕組件,單擊可以觸發Click事件,長按可以觸發LongPressed事件,長按鬆開時觸發LongClick事件。還可以和自定義外觀相結合,實現自定義的按鈕外形。 ...
  • 一、WTM是什麼 WalkingTec.Mvvm框架(簡稱WTM)最早開發與2013年,基於Asp.net MVC3 和 最早的Entity Framework, 當初主要是為瞭解決公司內部開發效率低,代碼風格不統一的問題。2017年9月,將代碼移植到了.Net Core上,併進行了深度優化和重構, ...