2017-07-18 58 views
0

我想知道我如何切換我的數組中的值由其屬性名稱。如何通過屬性值切換數組值

例如具有下列陣列我想切換(按鈕)具有名爲一個和/或打開和關閉b等屬性的所有值。

輸入

const arr_input = [ 
    { a: 1, b: 2, c: 3 }, 
    { a: 3, b: 9, c: 12 } 
]; 

輸出

const arr_output = [ 
    { b: 2, c: 3 }, 
    { b: 9, c: 12 } 
]; 

https://jsfiddle.net/cdp0a539/

+3

你是什麼_「切換」的意思_?您似乎在問,如何刪除並重新向數組添加值。 – evolutionxbox

+0

@evolutionxbox正確。我想刪除並添加相同的值/多個值。例如,我想切換'a'和'b'。 – debugmode

回答

0

你也許可以使用,array.reduce過濾掉你不想在你的輸出特性。

我試圖通過使用toggleArray複製下面的情況,您可以在其中傳遞一個屬性,您不需要。它會過濾掉數組並返回所需的輸出。

var arr_input = [{ 
 
    a: 1, 
 
    b: 2, 
 
    c: 3 
 
    }, 
 
    { 
 
    a: 3, 
 
    b: 9, 
 
    c: 12 
 
    } 
 
]; 
 

 
var toggleArray = function(propToToggle) { 
 
    return arr_input.reduce((arr, inp) => { 
 
    var obj = {}; 
 
    for(var key in inp) { 
 
    if(key != propToToggle) { 
 
     obj[key] = inp[key]; 
 
    } 
 
    } 
 
    arr.push(obj); 
 
    return arr; 
 
    }, []); 
 
} 
 

 
var arr_output = toggleArray('a'); 
 

 
console.log(arr_output); 
 

 
arr_output = toggleArray('b'); 
 
console.log(arr_output); 
 

 
arr_output = toggleArray('c'); 
 
console.log(arr_output);

0

從提琴採取以下將返回原始數組的副本與選定的屬性刪除

const items = [ 
 
    { 'a': 1, 'b': 2, 'c': 3 }, 
 
    { 'a': 3, 'b': 9, 'c': 12 } 
 
]; 
 

 
const toggleProperty = (value) => { 
 
    return items.map(function(el) { 
 
    var o = Object.assign({},el); 
 
    delete o[value]; 
 
    return o; 
 
    }); 
 
}
<button type="button" id="a" 
 
     onClick="console.log(toggleProperty('a'))">Toggle a</button> 
 

 
<button type="button" id="b" 
 
     onClick="console.log(toggleProperty('b'))">Toggle b</button> 
 

 
<button type="button" id="c" 
 
     onClick="console.log(toggleProperty('c'))">Toggle c</button>

0

你可以使用正確的副本用數組綁定並過濾鍵。

const toggle = (array, keys) => 
 
    array.map(o => 
 
     Object.assign(
 
      {}, 
 
      ...Object 
 
      .keys(o) 
 
      .filter(k => !keys.includes(k)) 
 
      .map(k => ({ [k]: o[k] })) 
 
     ) 
 
    ), 
 
    input = [{ a: 1, b: 2, c: 3 }, { a: 3, b: 9, c: 12 }]; 
 

 
console.log(toggle(input, ['a', 'b', 'c'])); 
 
console.log(toggle(input, ['a', 'b'])); 
 
console.log(toggle(input, ['a']));

0

爲了切換(也就是說當您切換第二次獨立於任何其他屬性的切換狀態的屬性將被再次添加),你需要保持狀態,瞭解目前是否有房產開業或關閉。

我會爲此引入一個額外的對象,該對象具有所有屬性,但值爲布爾值:如果應該包含該屬性,則爲true;否則爲false。

這裏是一個工作片段,將只有目前是「上」的屬性顯示對象:

const items = [ 
 
     { 'a': 1, 'b': 2, 'c': 3 }, 
 
     { 'a': 3, 'b': 9, 'c': 12 } 
 
    ], 
 
    // Keep an object with same keys, but with all values set to true: 
 
    state = Object.assign(...Object.keys(items[0]).map(key => ({ [key]: true }))); 
 

 
const toggleProperty = (key) => { 
 
    // Toggle state, so you know which keys are currently off or on: 
 
    state[key] = !state[key]; 
 
    // Produce the desired object and return it 
 
    return items.map(obj => 
 
     Object.assign(...Object.keys(state).map(key => 
 
      state[key] ? { [key]: obj[key] } : {} 
 
     )) 
 
    ); 
 
} 
 

 
// Handle the button clicks: 
 
a.onclick = b.onclick = c.onclick = function() { 
 
    output.textContent = JSON.stringify(toggleProperty(this.id), null, 2); 
 
    return false; 
 
}; 
 
// At page load, show the complete objects (everything is toggled on): 
 
output.textContent = JSON.stringify(items, null, 2);
<button id="a">Toggle a</button> 
 
<button id="b">Toggle b</button> 
 
<button id="c">Toggle c</button> 
 
<pre id="output"></pre> 

相關問題