本网站可以通过分类标签帮助你快速筛选出你想看的文章,记住地址:www.Facec.cc

js ... 扩展运算符的用法

在日常开发中,我们在看js代码时,经常会看到(...)这样的符号。这里介绍一下它的含义和作用。

一、扩展运算定义

扩展运算符(...)是ES6的语法,用于取出参数对象的所有可遍历属性,然后拷贝到当前对象之中。

let person = {name: "Amy", age: 15}
let someone = { ...person }
someone  // {name: "Amy", age: 15}

二、特殊用法

1.数组

由于数组是特殊的对象,所以对象的扩展运算符也可以用于数组。

let foo = { ...['a', 'b', 'c'] };
foo
// {0: "a", 1: "b", 2: "c"}

2.空对象

如果扩展运算符后面是一个空对象,则没有任何效果。

let a = {...{}, a: 1}
a // { a: 1 }

3.Int类型、Boolen类型、undefined、null

如果扩展运算符后面是上面这几种类型,都会返回一个空对象,因为它们没有自身属性。

// 等同于 {...Object(1)}
{...1} // {}

// 等同于 {...Object(true)}
{...true} // {}

// 等同于 {...Object(undefined)}
{...undefined} // {}

// 等同于 {...Object(null)}
{...null} // {}

4.字符串

{...'hello'}
// {0: "h", 1: "e", 2: "l", 3: "l", 4: "o"}

三、对象的合并

let age = {age: 15}
let name = {name: "Amy"}
let person = {...age, ...name}
person; // {age: 15, name: "Amy"}

# js  

评论