2017-04-05 52 views
0

假設我有這樣的對象用戶。如何在對象中指定項目的位置

const user = { 
    nationality: 'Italian', 
    age: 24, 
    name: { 
     firstName: 'rocky', 
     lastName: 'balboa', 
    }, 
    }; 

我更新了namefirstName項目。我想把這個改變傳遞給一些函數,這樣它也可以更新它自己的具有相同結構的用戶對象中的firstName。什麼是最好的方式來做到這一點?

根據我的理解,要指定firstName,我們將使用user[name][firstName]。但是,如何將其發送給另一個對象,比如primeUsers,以便它可以更新自己呢?

const primeUser = { 
    nationality: 'Italian', 
    age: 24, 
    name: { 
     firstName: 'rocky', 
     lastName: 'balboa', 
    }, 
    }; 

一種方法是發送「水平」的數組。所以我會送一個數組

const levels = ["name", "firstName"]; 

,但我不知道如何我會使用它來更新primeUserfirstName?對不起,這似乎很奇怪,我不是很清楚地解釋它。希望你明白我想要實現:)

+0

'const'關鍵字不允許修改的對象:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/const 。你應該使用'let'或'var' – cl3m

+0

用戶和PrimeUser有相同的結構嗎? –

+0

@ cl3m'const'允許您更新對象鍵。 –

回答

1

使用JavaScript 吸氣/二傳手功能:

得到語法綁定的對象屬性,這將是 調用的函數當那個財產被擡起時。


設置語法結合的對象屬性的函數被調用 當不存在要設置該屬性的嘗試。

const primeUser = { 
 
    nationality: 'Italian', 
 
    age: 24, 
 
    name: { 
 
     get firstName() { 
 
      return this._firstName; 
 
     }, 
 
     set firstName(fName) { 
 
      this._firstName = fName; 
 
     }, 
 
     lastName: 'balboa', 
 
    }, 
 
}; 
 
const user = { 
 
    nationality: 'Italian', 
 
    age: 24, 
 
    name: { 
 
     get firstName() { 
 
      return this._firstName; 
 
     }, 
 
     set firstName(fName) { 
 
      this._firstName = fName; 
 
      primeUser.name.firstName = fName; 
 
     }, 
 
     lastName: 'balboa', 
 
    }, 
 
}; 
 

 
user.name.firstName = 'rocky'; 
 

 
console.log(primeUser.name.firstName);

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/set

+0

雖然我明白你只是回覆帖子,我覺得有趣的是不要提他可以簡單地使用參考。從我看到的數據來看,不需要維護2個結構,以防從相同的來源獲得完全相同的數據 – Icepickle

1

我想傳達這種變化給一些功能,所以它也可以用相同的結構也

它自己的用戶對象更新 的firstName

您可以定義在firstName屬性的設置,並通過setter函數作爲自己將被調用每次這個屬性改變

演示

const user = { 
 
    nationality: 'Italian', 
 
    age: 24, 
 
    name: { 
 
     firstName: 'rocky', 
 
     lastName: 'balboa', 
 
    }, 
 
    }; 
 
    
 
function yourFunction(val) {console.log("value set ",val)} 
 
    
 
Object.defineProperty(user.name, "firstName" ,{set: yourFunction}); 
 

 
user.name.firstName = 1

0

你可以遍歷所有屬性並更新不同的值。

它適用於源和目標對象的任何相同結構。如果找到的屬性是一個可迭代的對象,則使用源和目標對象的實際屬性進行遞歸函數調用。

function update(source, target) { 
 
    Object.keys(source).forEach(function (k) { 
 
     if (source[k] && typeof source[k] === 'object') { 
 
      update(source[k], target[k]); 
 
      return; 
 
     } 
 
     if (target[k] !== source[k]) { 
 
      target[k] = source[k]; 
 
     } 
 
    }); 
 
} 
 

 
const user = { nationality: 'Italian', age: 24, name: { firstName: 'rocky', lastName: 'foo' } }; 
 
const primeUser = { nationality: 'Italian', age: 24, name: { firstName: 'rocky', lastName: 'balboa' } }; 
 

 
update(user, primeUser); 
 
console.log(primeUser);
.as-console-wrapper { max-height: 100% !important; top: 0; }

隨着空對象發生器,以及。

function update(source, target) { 
 
    Object.keys(source).forEach(function (k) { 
 
     if (source[k] && typeof source[k] === 'object') { 
 
      update(source[k], target[k] = target[k] || {}); 
 
      return; 
 
     } 
 
     if (target[k] !== source[k]) { 
 
      target[k] = source[k]; 
 
     } 
 
    }); 
 
} 
 

 
const user = { nationality: 'Italian', age: 24, name: { firstName: 'rocky', lastName: 'balboa' } }; 
 
const primeUser = { }; 
 

 
update(user, primeUser); 
 
console.log(primeUser);
.as-console-wrapper { max-height: 100% !important; top: 0; }

相關問題