资讯专栏INFORMATION COLUMN

20190610 ES6-解构赋值-数值、布尔值、函数参数、用途

Baoyuan / 2179人阅读

摘要:数值和布尔值的解构赋值解构赋值的规则只要等于号右边的值不是对象,则优先将其转为对象函数参数的解构赋值函数的参数实际上不是一个数组,而是通过解构得到的变量和。如果解构失败,则返回默认值。

数值和布尔值的解构赋值

解构赋值的规则:

只要等于号右边的值不是对象,则优先将其转为对象

let {toString: s} = 123;
s === Number.proptotype.toString // true

let {toString: s} = true;
s === Boolean.prototype.toString  // true
函数参数的解构赋值
function add([x,y]){
    retrun x + y;
}

add([1,2]) // 3

函数add的参数实际上不是一个数组,而是通过解构得到的变量x和y。

函数参数的解构依旧可以使用默认值

function move({x = 0, y = 0} = {}){
    retrun [x,y]
}
move({x: 3,y: 8}); // [3,8];
move({x: 3}) // [3,0]
move({}) // [0,0]
move() // [0,0]

函数move的参数是一个对象,通过对这个对象进行解构,得到变量x和y的值。如果解构失败,则返回默认值。

下面的写法,会存在一些问题
function move({x,y} = {x: 0,y: 0}){
    return [x,y];
}
move({x: 3,y: 8}); // [3,8];
move({x: 3}) // [3,undefined]
move({}) // [undefined,undefined]
move() // [0,0]

如果已经存在赋值,则会获取获取undefind

解构赋值的用途 变换变量的值
[x,y]=[y,x]
从函数中返回多个值
// 返回一个数组
function f(){
    return [1,2,3];
}

var [a,b,c] = f(); 

// 返回一个对象
function f1(){
    ruturn {
        foo: 1,
        bar: 2
    }
}
var {foo, bar} = f1();
函数参数的定义
function f([x,y,z]){...}
f({1,2,3})

function f([x,y,z]){...}
f({x:1,z:3,y:2})
提取JSON数据
var jsonData= {
    id: 42,
    status: "ok",
}

let {id,status: isok} = jsonData;
consoloe.log(id, isok); // 42 "OK"
函数参数的默认值
$.ajax=function (url,(
    async = true,
    beforeSend = function(){},
    cache = true,
    complete = function(){},
    crossDomain = false,
    global = true,
)){
    // TODO
}
遍历Map解构
var map = new Map() ;

map.set("first", "hello");
map.set("sec", "world");

for(let [key, value] of map){
    // 从循环的数值中依次赋值key和value
    console.log(key + "is" + value)
    // first is hello 
    // sec is world 
}
输入模块的制定方法
const { SourceMapConsumer, SourceNode} = require("source-map")
圆括号的问题

变量声明语句中,模式中不能有圆括号

var [(a)]=[1];
var [x: {c}]={};

函数参数中,模式不能带有圆括号

function f([(z)]) = { return z; }

不能讲整个模式或嵌套模式中的一层放在圆括号中

({p: a})={p: 42}
([a]) = [5]
何正确的使用圆括号

赋值语句的非模式部分可以使用圆括号

[(b)] = [3];
({p: (d)} = {})

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/104567.html

相关文章

  • ES6-变量的解构(3)

    摘要:数组的解构赋值特点根据数据的下标来赋值的,有次序。模式能够匹配起来,如长度为数值和布尔值的解构赋值解构赋值的规则是只要等号右边的值不是对象或数组,就先将其转为对象。布尔值解构赋值为字符串的一种。在很多独立细小的方面,解构赋值都非常有用。 1、解构赋值简介 官方解释:按照一定的模式,从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructuring)。 举个例子,想获取数组中...

    Jason_Geng 评论0 收藏0
  • ES6标准入门》读书笔记

    摘要:标准入门读书笔记和命令新增命令,用于声明变量,是块级作用域。用于头部补全,用于尾部补全。函数调用的时候会在内存形成一个调用记录,又称为调用帧,保存调用位置和内部变量等信息。等到执行结束再返回给,的调用帧才消失。 《ES6标准入门》读书笔记 @(StuRep) showImg(https://segmentfault.com/img/remote/1460000006766369?w=3...

    HollisChuang 评论0 收藏0
  • 珠峰培训ES6学习笔记1

    摘要:消除字符串头部空格消除尾部空格从头部补全字符串从尾部补全字符串 let和const var关键字定义变量的特点: 可以重复定义 不能定义常量 不支持块级作用域 let的特点 不可以重复定义 变量不能提升,在变量定义之前,不能使用 在大括号当中定义的变量(块级作用域中),在作用域外无法访问 解决一些ES5当中需要闭包实现的功能,比如:每隔1秒循环输出一个当前的值 const的特点...

    番茄西红柿 评论0 收藏0

发表评论

0条评论

Baoyuan

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<