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

Baoyuan 发布于2019-08-23 18:02 / 2267人阅读

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

数值和布尔值的解构赋值

解构赋值的规则：

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

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)} = {})

云服务器 GPU云服务器解构赋值解构函数布尔值 python 布尔值

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

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

ES6-变量的解构赋值(3)

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

Jason_Geng 2019-08-23 16:46 评论0 收藏0
《ES6标准入门》读书笔记

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

HollisChuang 2019-08-19 18:41 评论0 收藏0
珠峰培训ES6学习笔记1

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

番茄西红柿 2019-08-23 18:33 评论0 收藏0
ES6基础知识01(let,const,解构赋值)

摘要：声明的变量不得改变值，这意味着，一旦声明变量，就必须立即初始化，不能留到以后赋值。解构赋值允许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构。对象的解构赋值对象的属性没有次序，变量必须与属性同名。 ES6 新增特性整理讲解新增命令 1.let命令 ES6新增了let命令，用来声明变量。它的用法类似于var，但是也存在新的特性。 - **let所声明的变量，只在le...

MSchumi 2019-08-22 17:36 评论0 收藏0