菜单
×
   ❮     
HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY EXCEL XML DJANGO NUMPY PANDAS NODEJS R TYPESCRIPT ANGULAR GIT POSTGRESQL MONGODB ASP AI GO KOTLIN SASS VUE DSA GEN AI SCIPY AWS CYBERSECURITY DATA SCIENCE
     ❯   

React ES6 展开运算符


展开运算符

JavaScript 展开运算符 (...) 允许我们快速地将一个现有数组或对象的所有或部分内容复制到另一个数组或对象中。

示例

const numbersOne = [1, 2, 3];
const numbersTwo = [4, 5, 6];
const numbersCombined = [...numbersOne, ...numbersTwo];

自己动手试一试 »

展开运算符通常与解构结合使用。

示例

numbers 中的第一和第二个项分配给变量,并将其余的项放入一个数组中

const numbers = [1, 2, 3, 4, 5, 6];

const [one, two, ...rest] = numbers;

自己动手试一试 »

我们也可以对对象使用展开运算符

示例

合并这两个对象

const myVehicle = {
  brand: 'Ford',
  model: 'Mustang',
  color: 'red'
}

const updateMyVehicle = {
  type: 'car',
  year: 2021, 
  color: 'yellow'
}

const myUpdatedVehicle = {...myVehicle, ...updateMyVehicle}

自己动手试一试 »

请注意,不匹配的属性被合并了,但匹配的属性 color 被最后传入的对象 updateMyVehicle 覆盖了。最终的 color 现在是 yellow。



×

联系销售

如果您想将 W3Schools 服务用于教育机构、团队或企业,请发送电子邮件给我们
sales@w3schools.com

报告错误

如果您想报告错误,或想提出建议,请发送电子邮件给我们
help@w3schools.com

W3Schools 经过优化,旨在方便学习和培训。示例可能经过简化,以提高阅读和学习体验。教程、参考资料和示例会不断审查,以避免错误,但我们无法保证所有内容的完全正确性。使用 W3Schools 即表示您已阅读并接受我们的使用条款Cookie 和隐私政策

版权所有 1999-2024 Refsnes Data。保留所有权利。W3Schools 由 W3.CSS 提供支持