JavaScript選取(picking)和反選(rejecting)對(duì)象的屬性方法
有時(shí)候我們需要將一個(gè)對(duì)象的某些屬性選取出來，比方說我們有一個(gè)用數(shù)組表示的數(shù)據(jù)庫表，我們需要一些函數(shù)來 select (選取) 幾個(gè)字段：
function pick(obj, keys) {
return keys.map(k => k in obj ? {[k]: obj[k]} : {})
.reduce((res, o) => Object.assign(res, o), {});
}
const row = {
'accounts.id': 1,
'client.name': 'John Doe',
'bank.code': 'MDAKW213'
};
const table = [
row,
{'accounts.id': 3, 'client.name': 'Steve Doe', 'bank.code': 'STV12JB'}
];
pick(row, ['client.name']); // 取到了 client name
table.map(row => pick(row, ['client.name'])); // 取到了一系列 client name
在 pick 函數(shù)中用到了一點(diǎn)小技巧。首先，我們用 map 遍歷了鍵名數(shù)組（keys）, 每次都會(huì)返回一個(gè)包含當(dāng)前鍵名（key）的對(duì)象（如果在目標(biāo)對(duì)象（obj）中沒有當(dāng)前鍵名，就會(huì)返回空對(duì)象）。然后我們用 reduce 把返回的所有單個(gè)鍵-值對(duì)象和合并到一個(gè)對(duì)象中。
但是，如果我們想反選（ reject ）屬性／鍵名呢？改造一下我們的函數(shù)就好了：
function reject(obj, keys) {
return Object.keys(obj)
.filter(k => !keys.includes(k))
.map(k => ({[k]: obj[k]}))
.reduce((res, o) => Object.assign(res, o), {});
}
// 或者, 利用 pick
function reject(obj, keys) {
const vkeys = Object.keys(obj)
.filter(k => !keys.includes(k));
return pick(obj, vkeys);
}
reject({a: 2, b: 3, c: 4}, ['a', 'b']); // => {c: 4}
總結(jié)
以上所述是小編給大家介紹的JavaScript選取(picking)和反選(rejecting)對(duì)象的屬性方法，希望對(duì)大家有所幫助，如果大家有任何疑問請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！
相關(guān)文章
js實(shí)現(xiàn)表格的隔行變色和上下移動(dòng)
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)表格的隔行變色和上下移動(dòng)，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-02-02
JS或jQuery獲取ASP.NET服務(wù)器控件ID的方法
這篇文章主要介紹了JS或jQuery獲取ASP.NET服務(wù)器控件ID的方法,本文介紹一方法,解決如何使用js獲取ASP.NET控件在瀏覽器端生成html標(biāo)簽對(duì)應(yīng)的id,需要的朋友可以參考下2015-06-06
這篇文章主要為大家詳細(xì)介紹了JS實(shí)現(xiàn)消滅星星小游戲，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-01-01
LayUI動(dòng)態(tài)設(shè)置checkbox不顯示的解決方法
今天小編就為大家分享一篇LayUI動(dòng)態(tài)設(shè)置checkbox不顯示的解決方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2019-09-09
viewer.js實(shí)現(xiàn)圖片預(yù)覽功能
這篇文章主要為大家詳細(xì)介紹了viewer.js實(shí)現(xiàn)圖片預(yù)覽功能，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2020-06-06
html+css+js實(shí)現(xiàn)別踩白板小游戲
大家好,本篇文章主要的講的是html+css+js實(shí)現(xiàn)別踩白板小游戲，感興趣的同學(xué)趕快來看一看吧，覺得不錯(cuò)的話可以收藏一下哦，方便下次瀏覽2021-11-11
WebGIS開發(fā)中不同坐標(biāo)系坐標(biāo)轉(zhuǎn)換問題解決基本步驟
這篇文章主要介紹了如何在JavaScript中使用proj4庫進(jìn)行坐標(biāo)系轉(zhuǎn)換的基本步驟,包括安裝、示例、自定義坐標(biāo)系定義、擴(kuò)展以及一些常見EPSG代碼對(duì)照表,需要的朋友可以參考下2025-01-01
js實(shí)現(xiàn)數(shù)字滾動(dòng)特效
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)數(shù)字滾動(dòng)特效，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-12-12
JS中new?Date().Format("yyyy-MM-dd")?報(bào)錯(cuò)的解決
這篇文章主要介紹了JS中new?Date().Format("yyyy-MM-dd")?報(bào)錯(cuò)的解決方案，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2023-01-01
本文為大家分享的是一款效果非?？岬奈募蟼鞅韱斡蛎阑匦АＳ?種不同的美化文件上傳域的效果，很時(shí)尚，感興趣的小伙伴們可以參考一下2015-11-11