constは、スプレッド演算子を介してプロパティを更新するのはなぜですか？コードレビューの際

Question

は、それは私がオブジェクトを更新するスプレッド演算子と定数を使用することができることを指摘された：

const props = { 
 
    hairColor: 'brown', 
 
}; 
 

 
const hairColor = 'red'; 
 
const newProps = { ...props, hairColor}; 
 

 
console.log(newProps); // -> hairColor now equals 'red'

質問は、この作業を行いますか？

私は、オブジェクトを渡すと、どのように機能するかを実際に理解：

const newProps = { ...props, { hairColor: 'red' }}; 

をしかし、どのように、それは「赤」の値でhairColorを更新するために知っているのですか？クイックテストは変数名を使用していることを示していますが、どうですか？

const props = { 
 
    hairColor: 'brown', 
 
}; 
 

 
const colorOfHair = 'red'; 
 
const newProps = { ...props, colorOfHair}; 
 

 
// -> hairColor still equals 'brown' 
 
// with new property 'colorOfHair' 
 
console.log(newProps);

Answer 1

これはES6 shorthand property namesです。オブジェクトにnameと書くと、name: nameのショートカットになります。

const newProps = { prop1: 1, prop2: 2, hairColor };