- 用于函數(shù)調(diào)用時(shí)的參數(shù)
const func = (a,b,c) => {
//*****
}
const array = [1,2,3]
func(...array)
- 當(dāng)做函數(shù)調(diào)用時(shí)候的參數(shù)就相當(dāng)于是擴(kuò)展
- 將每個(gè)元素?cái)U(kuò)展開來(lái)當(dāng)做函數(shù)的一個(gè)參數(shù)
- 用于react傳遞props屬性
render() {
const obj = {name:'zp' ,age: 20}
return (
<Children {...obj} />
)
}
const Children = (props) => {
console.log(props.name)
console.log(props.age)
}
//這樣的好處：如果不使用擴(kuò)展運(yùn)算符render函數(shù)就需要這么寫
render() {
const obj = {name:'zp' ,age: 20}
return (
<Children
name = {obj.name}
age={obj.age}
/>
)
}
//這就相當(dāng)于把對(duì)象的名字作為屬性傳給子組件使用
大大減少代碼數(shù)量
- 用于數(shù)組的拼接和排序
const a = [1,2,3]
const b = [4,5,6]
const c = [...b,...a]
- 用于reducer掉分，產(chǎn)生新對(duì)象(新引用)
- 對(duì)于reducer而言如果返回的對(duì)象或者數(shù)組沒有改變引用鞠绰，他就會(huì)認(rèn)為store中的數(shù)據(jù)沒有變化過(guò)所以不會(huì)觸發(fā)組件重新render（即使可能數(shù)組或?qū)ο笾械哪骋豁?xiàng)確實(shí)發(fā)生變化）
- 使用擴(kuò)展運(yùn)算符即使元素沒變（內(nèi)容）也會(huì)產(chǎn)生一個(gè)全新的對(duì)象或者數(shù)組（新引用）一定保證了store可以更新觸發(fā)新的render（可以代替Object.assign存在）
const initState = {
name: 'pp',
age: 20
}
const reducer = (action,state) => {
switch (action.type) {
case *** :
return {...state,{name:'aa'}}
}
}
總結(jié)：使用擴(kuò)展運(yùn)算符的對(duì)象或者數(shù)組，都是為了將其中的每一個(gè)元素可以獨(dú)立的使用
