簡單聊聊JavaScript 中的原型鏈、null 和 undefined 的區別
1.原型鏈
個人觀點:原型鏈和邏輯判斷里三段論有些類似,一個大前提、一個小前提、一個結論。比如,動物會吃肉,狗是動物,所以狗會吃肉。這也是繼承的思想
原型和構造函數
JavaScript 是基于原型的面向對象編程語言,每個對象都有一個內部鏈接到另一個對象(即原型)。這個機制被稱為原型鏈。原型鏈的存在使得對象可以繼承其他對象的屬性和方法。
function Person(name) { this.name = name; } Person.prototype.sayHello = function() { console.log(`Hello, my name is ${this.name}`); }; const alice = new Person('Alice'); alice.sayHello(); // Hello, my name is Alice
在上面的例子中,Person 是一個構造函數,Person.prototype 是它的原型對象。通過 new Person('Alice') 創建的 alice 對象繼承了 Person.prototype 上的 sayHello 方法。這種繼承關系是通過原型鏈實現的。
原型鏈的繼承
當訪問一個對象的屬性或方法時,JavaScript 引擎首先會在對象本身查找。如果找不到,它會沿著原型鏈向上查找,直到找到該屬性或方法,或者到達原型鏈的末端。
function Animal(name) { this.name = name; } Animal.prototype.eat = function() { console.log(`${this.name} is eating`); }; function Dog(name) { Animal.call(this, name); // 繼承屬性 } Dog.prototype = Object.create(Animal.prototype); // 繼承方法 Dog.prototype.constructor = Dog; const dog = new Dog('Buddy'); dog.eat(); // Buddy is eating
在這個例子中,Dog 繼承了 Animal 的屬性和方法。通過 Object.create(Animal.prototype),我們創建了一個新的原型對象,這個對象的原型是 Animal.prototype。這就建立了一個原型鏈,Dog 的實例 dog 可以訪問 Animal 的方法。
2.null 和 undefined(面試經常問)
undefined
undefined 是 JavaScript 中的一種基本數據類型,表示變量已經聲明但尚未賦值。它也是全局對象的一個屬性(window.undefined)。
let x; console.log(x); // undefined function greet(name) { console.log(`Hello, ${name}`); } greet(); // Hello, undefined
在上面的例子中,變量 x 被聲明但沒有賦值,因此其值是 undefined。函數 greet 在沒有傳入參數時,name 的值也是 undefined。
null
null 是 JavaScript 中的另一個基本數據類型,表示一個空對象引用。它通常用于顯式地表示變量沒有任何值。
let y = null; console.log(y); // null const obj = { key: null }; console.log(obj.key); // null
在上面的例子中,變量 y 被賦值為 null,表示它不引用任何對象。同樣,obj.key 被顯式設置為 null。
null 與 undefined 的區別
盡管 null 和 undefined 都表示“沒有值”,但它們有顯著的區別:
-
類型:
undefined是一個類型。null是一個對象類型。
-
用法:
undefined表示變量尚未賦值。null表示變量已賦值為空對象。
-
比較:
- 使用
==比較時,null和undefined被認為是相等的: -
console.log(null == undefined); // true
- 使用
===比較時,null和undefined被認為是不相等的: -
console.log(null === undefined); // false
- 使用

浙公網安備 33010602011771號