如何在 JavaScript 中反轉物件?
反轉表示以相反的順序列印值。用技術術語來說,我們可以說假設我們取了一個數組物件。該物件以鍵值對的形式取值,並以值鍵對的形式列印值。
_.invert() 函式屬於 underscore.js,這是一個提供通用函式的 JavaScript 庫。
它用於複製一個物件,其中物件鍵被轉換為值,物件被轉換為鍵。這意味著物件的 [鍵,值] 被反轉了。
語法
以下是_.invert() 函式的語法:
_.invert(object)
物件 - 物件是陣列的鍵值對。
返回值 - 它以相反的順序 [值,鍵] 返回物件的 [鍵,值]。
示例 1
在以下示例中,我們建立了一個名為 obj 的物件,將 obj 變數傳遞給_.invert() 函式,並以值-鍵對的形式返回該值。
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript"src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js"></script>
</head>
<body>
<script type="text/javascript">
var obj = {
Company: "TurorialsPoint",
Address: "Hyderabad",
Contact: "+917654980321",
Email: "xyz123@gmail.com",
};
document.write(JSON.stringify(_.invert(obj)));
</script>
</body>
</html>
示例 2
在以下示例中,我們將名為 obj 的物件傳遞給_.invert() 函式,並將其轉換為字串以在頁面上顯示返回資料。
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript"src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js"></script>
</head>
<body>
<script type="text/javascript">
var obj = {
num1: "91",
num2: "82",
num3: "52",
num4: "19",
};
var number = JSON.stringify(_.invert(obj));
document.write(number);
</script>
</body>
</html>
示例 3
讓我們再看一個_.invert() 函式的示例:
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript"src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js"></script>
</head>
<body>
<script type="text/javascript">
var detail = JSON.stringify(
_.invert({ name: "JP ANNA", age: 324, salary: 220000 })
);
document.write(detail);
</script>
</body>
</html>
示例 4:使用箭頭函式(=>)
在本例中,我們將討論箭頭函式的使用。在這種情況下,我們將使用=> 箭頭函式來反轉物件的鍵/值對。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<scripttype="text/javascript"src="//cdnjs.cloudflare.com/ajax/libs/lodash.js/0.10.0/lodash.min.js"></script>
<title>Invert an object</title>
<div id="invert"></div>
</head>
<body>
<script type="text/javascript">
let obj = {
name: "Alice",
age: 21,
role: "Full stack developer",
};
let invertObj = (obj) =>
Object.fromEntries(Object.entries(obj).map(([key, value]) => [value, key]));
document.getElementById("invert").innerHTML = JSON.stringify(
invertObj(obj)
);
</script>
</body>
</html>
示例 5:使用 reverse() 方法
在本例中,我們將使用reverse() 方法在 JavaScript 中反轉物件。此方法用於反轉物件的鍵/值對。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<scripttype="text/javascript"src="//cdnjs.cloudflare.com/ajax/libs/lodash.js/0.10.0/lodash.min.js"></script>
<title>Invert an object</title>
<div id="invert"></div>
</head>
<body>
<script type="text/javascript">
let obj = {
name: "Alice",
age: 21,
role: "Full stack developer",
};
function invertObj(obj) {
let invert_obj = {};
reverse_obj = Object.keys(obj).reverse();
reverse_obj.forEach(function (x) {
invert_obj[x] = obj[x];
});
return invert_obj;
}
rev = invertObj(obj);
document.getElementById("invert").innerHTML = JSON.stringify(rev);
</script>
</body>
</html>
廣告
資料結構
網路
關係型資料庫管理系統
作業系統
Java
iOS
HTML
CSS
Android
Python
C 程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP