JavaScript選取(picking)和反選(rejecting)對(duì)象的屬性方法
更新時(shí)間：2017年08月16日 10:01:12 投稿：mrr
這篇文章主要介紹了JavaScript選取(picking)和反選(rejecting)對(duì)象的屬性方法的相關(guān)資料,需要的朋友可以參考下
有時(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)文章
我們可以將call和apply看做是某個(gè)對(duì)象的方法，通過調(diào)用方法的形式來間接調(diào)用函數(shù)2013-09-09
11個(gè)Javascript小技巧幫你提升代碼質(zhì)量(小結(jié))
這篇文章主要介紹了11個(gè)Javascript小技巧幫你提升代碼質(zhì)量(小結(jié))，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-12-12
基于Ionic3實(shí)現(xiàn)選項(xiàng)卡切換并重新加載echarts
這篇文章主要介紹了基于Ionic3實(shí)現(xiàn)選項(xiàng)卡切換并重新加載echarts,文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2020-09-09
下面小編就為大家?guī)硪黄齽t表達(dá)式替換html元素屬性的方法。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-11-11
JavaScript中執(zhí)行上下文和執(zhí)行棧
這篇文章主要介紹了JavaScript中執(zhí)行上下文和執(zhí)行棧，執(zhí)行上下文是評(píng)估和執(zhí)行JavaScript代碼的環(huán)境的抽象概念，更多相關(guān)介紹，感興趣的朋友可以參考一下2022-09-09
JavaScript中常見的數(shù)據(jù)格式化方式詳解
這篇文章主要為大家詳細(xì)介紹了JavaScript中常見的數(shù)據(jù)格式化方式,文中的示例代碼講解詳細(xì),具有一定的借鑒價(jià)值,感興趣的小伙伴可以了解一下2023-12-12
跨域常見的兩種方式，分別是jsonp和cors，這篇文章主要介紹了跨域解決之JSONP和CORS的詳細(xì)介紹，非常具有實(shí)用價(jià)值，需要的朋友可以參考下2018-11-11
本文通過實(shí)例代碼給大家介紹了定制FileField中的上傳文件名稱問題，感興趣的朋友參考下吧2017-08-08
關(guān)于JSON解析的實(shí)現(xiàn)過程解析
這篇文章主要介紹了關(guān)于JSON解析的實(shí)現(xiàn)過程解析,文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2019-10-10
這篇文章主要給大家介紹了關(guān)于微信小程序?qū)崿F(xiàn)左滑刪除效果的相關(guān)資料,左滑刪除效果在app的交互方式中十分流行,比如全民應(yīng)用微信,文中給出了詳細(xì)的實(shí)現(xiàn)代碼,需要的朋友可以參考下2023-08-08