使用物件的屬性時如何拋出錯誤？
- WBOY轉載
- 2023-08-26 08:13:11596瀏覽
在 JavaScript 中，物件包含鍵值格式的屬性。我們可以透過以物件為引用，使用屬性名稱來存取物件的任何屬性。
有時，我們嘗試存取物件中不存在的物件屬性。在這種情況下，我們會得到未定義的值。讓我們透過下面的例子來理解它。
範例（存取物件屬性）
在下面的範例中，我們建立了物件並添加了一些屬性。此外，我們還添加了一些嵌套屬性。之後，我們嘗試存取“prop5”屬性，它是“prop4”的嵌套屬性。使用者可以在輸出中觀察其值。
此外，我們嘗試存取「prop6」屬性，但物件傳回未定義，因為它不存在於物件中。
<html>
<body>
<h2>Accessing the object properties in JavaScript</h2>
<div id="content"> </div>
<script>
let content = document.getElementById('content');
let object = {
name: 'Shubham',
prop1: 'Hello',
prop2: 'World',
prop3: '!',
prop4: {
prop5: 'This is a nested object.'
}
}
content.innerHTML = "The value of prop5 is : " + object.prop4.prop5;
content.innerHTML += "<br> The value of prop3 is : " + object.prop3;
content.innerHTML += "<br> The value of prop6 is : " + object.prop6;
</script>
</body>
</html>
因此，每當物件中不存在某個屬性時，我們就可以拋出一個錯誤，指出該屬性在物件中不存在。
在這裡，我們將學習一種在存取物件屬性時拋出錯誤的不同方法。
使用「in」運算子在存取物件屬性時引發錯誤
「in」運算子允許我們檢查物件中是否存在屬性。我們可以使用鍵作為「in」運算子的左操作數，使用物件作為右操作數。
我們可以檢查物件中是否存在屬性。如果沒有，我們可以拋出一個錯誤。
文法
使用者可以依照下列語法使用「in」運算子在存取物件屬性時拋出錯誤。
if(key in obj){
}else {
// throw error
}
在上面的語法中，鍵是一個屬性，用於檢查它是否存在於物件中。
範例
在下面的範例中，我們建立了 table_obj 物件並新增了一些鍵值對。名為 get_property_value() 的函數會檢查物件中是否存在屬性。如果該屬性存在於物件中，則傳回該屬性值。否則，它會拋出錯誤。
在 try-catch 區塊中，我們捕獲了一個錯誤。在輸出中，使用者可以觀察到 get_property_value() 函數針對「table_price1」屬性拋出錯誤，而不是傳回該屬性的未定義值。
<html>
<body>
<h3>Using the <i> in </i> operator to throw an error while accessing the object properties in JavaScript</h3>
<div id = "content"> </div>
<script>
let content = document.getElementById('content');
// creating an object for table details
let table_obj = {
table_name: "table1",
table_type: "table",
table_size: "10x10",
table_color: "black",
table_price: 1000
}
function get_property_value(key) {
if (key in table_obj) {
return table_obj[key];
} else {
throw new Error(key + " is not a valid property name.");
}
}
try {
content.innerHTML += "table_name : - " + get_property_value("table_name");
content.innerHTML += "<br>" + get_property_value("table_price1");
} catch (e) {
content.innerHTML += "<br>" + e.message;
}
</script>
</body>
</html>
使用defineProperty()方法存取物件屬性時拋出錯誤
Javascript的defineProperty()方法允許我們為物件添加屬性。我們可以為拋出錯誤的屬性描述符新增 getter。
文法
使用者可以按照下面的語法使用defineProperty()方法在存取物件屬性時拋出錯誤。
Object.defineProperty(obj_name, 'prop_name', {
get: () => {
// throw an error
}
});
在上面的語法中，我們將描述子作為defineProperty()方法的第三個參數傳遞。我們可以從物件的特定屬性的描述符函數中拋出錯誤。
參數
Obj_name - 這是向物件新增屬性的物件名稱。
Prop_name - 這是要新增到物件的屬性名稱。
{ get: () => { } } - 它是物件屬性的 getters 函數。
範例
在下面的範例中，我們建立了具有零個屬性的empty_obj物件。我們使用defineProperties()方法來新增屬性。作為描述符，我們新增了 get() 方法，該方法會拋出錯誤並顯示錯誤訊息。
在輸出中，使用者可以觀察到當我們嘗試存取「prop1」屬性時它會拋出錯誤。
<html>
<body>
<h3>Using the <i> defineProperty() </i> method to throw an error while accessing the object properties in JavaScript </h3>
<div id = "content"> </div>
<script>
let content = document.getElementById('content');
let empty_obj = {};
Object.defineProperty(empty_obj, 'prop1', {
get: () => {
throw new Error('You cannot access prop1 property');
}
});
try {
content.innerHTML = "The value of prop1 property in the empty object is " + empty_obj.prop1;
}
catch (err) {
content.innerHTML = "The error is : - " + err;
}
</script>
</body>
</html>
存取物件屬性時使用 Proxy() 建構子引發錯誤
Proxy() 建構函數允許我們為物件建立代理並覆蓋物件的所有描述符，例如 getter 和 setter。在這裡，我們可以重寫 getters() 並寫一個可以拋出錯誤的新函數。
文法
使用者可以使用下面的語法來使用 Proxy() 建構子在存取物件屬性時拋出錯誤。
let proxy_obj = new Proxy(target_Obj, {
get: function (target, prop) {
// throw error
},
});
在上面的語法中，target_obj是一個為其建立代理的物件。我們已將包含 get() 方法的物件作為第二個參數傳遞。在 get() 方法中，我們可以驗證物件屬性，如果物件屬性無效，則拋出錯誤。
範例
在下面的範例中，我們使用 Proxy() 建構函式建立了 targetObj 物件的代理。在建立代理時，我們檢查使用者是否存取了「prop5」屬性。如果沒有，我們總是會拋出錯誤。這意味著只能從物件存取“prop5”屬性。但是，它將傳回「prop5」屬性的未定義值，因為我們尚未在物件中定義它。
<html>
<body>
<h3>Using the <i> defineProperty() </i> method to throw an error while accessing the object properties in JavaScript </h3>
<div id = "content"> </div>
<script>
let content = document.getElementById('content');
let targetObj = {
prop1: 'Hello',
}
let proxy_obj = new Proxy(targetObj, {
get: function (target, prop) {
if (prop != 'prop5') {
throw new Error('You are only allowed to access prop5');
}
},
});
try {
content.innerHTML += "The value of prop1 is: " + proxy_obj.prop1 + "<br>";
} catch (e) {
content.innerHTML += "The error is - " + e + "<br>";
}
</script>
</body>
</html>
以上是使用物件的屬性時如何拋出錯誤？的詳細內容。更多資訊請關注PHP中文網其他相關文章！