js算术运算符例题 (玩转js基础运算符)

详细文章请关注公众号:程序员波波。

或者点击文章最下方了解更多前往原文地址。

JavaScript中es6里面有一个扩展运算符...感觉十分方便。和Python中的*、**有点类型。

...的作用是展开一个对象或者数组中的数据,比如:

js算术运算符例题,js三点运算符教程

let a = [1, 2, 3]
let b = [2, ...a, 4] // b = [2, 1, 2, 3, 4]

sum(...a)  sum(1, 2, 3)

let x = {a: 1, b: 2}
let y = {...x, c: 3, d: 4} // y = {a: 1, b: 2, c: 3, d: 4}

很方便的能进行合并数组或者对象。

实例:

这样在开发中,某个接口传入一个args,我想提取某个变量,而且剩余变量给其他接口处理:

js算术运算符例题,js三点运算符教程

let args = {x: 1, y: 2, z: 3, point: {}}

function test(args) {
 const { point, ...others } = args
 // const { point: the_point, ...others } = args 取出point的同时命名为the_point
 dealOthers(others)
}

或者在开发中,想把一些参数添加到args中,然后给其他接口调用:

js算术运算符例题,js三点运算符教程

let args = {x: 1, y: 2, z: 3, point: {}}

function test(a, b, args) {
 const others = {
 ...args,
 a, // 等价于a: a,
 the_b: b,
 }
 dealOthers(others)
}

甚至还有一些奇怪的定义变量的方式:

js算术运算符例题,js三点运算符教程

let [a, b, c] = [1, 2, 3] // a = 1, b = 2, c = 3
let [a, b, ...others] = [1, 2, 3, 4, 5, 6] // a = 1, b = 2, others = [3, 4, 5, 6]
let { a, b, c } = { a: 1, b: 2, c: 3 } // a = 1, b = 2, c = 3
let { a, b, ...others } = { a: 1, b: 2, c: 3, d: 4 } // a = 1, b = 2, others = {c: 3, d: 4}