这里是我觉得es6解构赋值,在平时我们写js的时候非常有用,而且经常用到的地方,能简化我们的代码,让写代码简介优雅易读;

用途

1.交换变量的值,太方便了这逼,写法不仅简介而且一看就明白

let [x,y]=[1,2];
[x,y]=[y,x];
console.log(x);//输出2
console.log(y);//输出1

2.从函数返回多个值

函数只能返回一个值,如果要返回多个值,只能将它们放在数组或者对象里面返回.有了解构赋值,取出这些值那是非常的方便,最关键是易读

function obj1(){
return [1,2,3,];
}
let [a,b,c]=obj1();
console.log(a);//1
console.log(b);//2
console.log(c);//3 function obj2(){
return {
name:"张三",
age:18
}
}
let {name,age}=obj2();
console.log(name);//张三
console.log(age);//18

3.函数参数的定义

解构赋值可以方便地将一组参数与变量名对应起来

//参数是一组有次序的值
function f([x,y,z]){...}
f([1,2,3]); //参数可以无次序传参
function f({x,y,z}){...}
f({y:2,x:1,z:3})

4.提取json对象数据

解构赋值对提取json对象中的数据,尤其有用

let jsonData={
id:42,
name:"张三",
score:[99,100,99]
} let {id,name,score}=jsonData;
console.log(id,name,score);//42 '张三' [99,100,99]

es6变量解构赋值的用途的更多相关文章

  1. ES6变量解构赋值

    ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构ES6之前我们申明多个变量需要按照下面的方法: let l a=1; let b=2; let c=3; let d=4; ...

  2. ES6变量解构赋值的用法

    一.数组赋值(从数组中提取值,按照对应位置,对变量赋值) 1. 完全解构(变量与值数目相等) let arr = [1, 2, 3]; let [a,b,c] = arr; console.log(a ...

  3. 001-es6变量声明、解构赋值、解构赋值主要用途

    一.基本语法 1.1.声明变量的六种方法 参看地址:http://es6.ruanyifeng.com/#docs/let let:局部变量,块级作用域,声明前使用报错 var:全局变量,声明前使用 ...

  4. ES6的变量解构赋值

      前  言 ES6 解构赋值: ES6允许按照一定模式从数组和对象中提取值,然后对变量进行赋值,这被称为解构. 1.1 数组的结构赋值 1.1.1基本用法 JS中,为变量赋值直接指定.例如下面代码: ...

  5. ECMAScript6学习笔记 ——let、const、变量解构赋值

    let 不存在变量提升 通过let声明的变量仅在块级作用域内有效 不允许在同一个作用域内重复声明一个变量 防止值公用 var oUl = document.querySelectorAll('ul&g ...

  6. ES6 的解构赋值前每次都创建一个对象吗?会加重 GC 的负担吗?

    本文来源于知乎上的一个提问. 为了程序的易读性,我们会使用 ES6 的解构赋值: function f({a,b}){} f({a:1,b:2}); 这个例子的函数调用中,会真的产生一个对象吗?如果会 ...

  7. es6的解构赋值用途

    (1)交换变量的值 let x = 1; let y = 2; [x, y] = [y, x]; 上面代码交换变量x和y的值,这样的写法不仅简洁,而且易读,语义非常清晰. (2)从函数返回多个值 函数 ...

  8. 【es6】变量解构赋值

    1.数组解构赋值 let [a,b,c]=[1,2,3];//数组解构赋值,注意:左右两边格式需一致 let [a,b]=[1,2,3];//不完全解构,取位置靠前的值 let [a=1,b]=[un ...

  9. 进军es6(2)---解构赋值

    本该两周之前就该总结的,但最近一直在忙校招实习的事,耽误了很久.目前依然在等待阿里HR面后的结果中...但愿好事多磨!在阿里的某轮面试中面试官问到了es6的掌握情况,说明es6真的是大势所趋,我们更需 ...

随机推荐

  1. opencv学习笔记1

    #对图像的像素处理#法1print("------------------------")image = cv.imread("D:/1.jpeg",cv.IM ...

  2. HTML 培训教程

                                                                  HTML培训教程 1. HTML概述 1.1. 什么是 HTML 文件? n ...

  3. office 2013 破解工具 及 软件下载

     win7/win8/win10  office2013 破解工具 下载地址: https://pan.baidu.com/s/1sZeJOCWq1fZ3KIOWvmrAQQ office2013  ...

  4. Tomcat 配置文件的解析

    转载:https://www.cnblogs.com/sunshine-1/p/8990044.html https://www.cnblogs.com/kismetv/p/7228274.html ...

  5. @staticmethod 和@classmethod区别

    python中@classmethod @staticmethod区别 Python中3种方式定义类方法, 常规方式, @classmethod修饰方式, @staticmethod修饰方式. cla ...

  6. C++_友元1-友元类是什么

    友元函数:不是类的成员函数,但是能够访问类的私有数据成员. 之前有个矛盾就是规定非成员函数不能直接访问类的私有数据,但是这会儿却可以,但那只是针对常规非成员函数而言,特殊的非成员函数就可以访问类的私有 ...

  7. AngularJs依赖注入写法笔记

    下面两种依赖注入写法等价: [第一种] app.controller('lrNListingController', function (Notifier, Private, timefilter, ...

  8. HDU 6299 Balanced Sequence(贪心)

    题目:给出N个只有左右括号字符串 ,这N个字符串的排列顺序是任意的 , 问按最优的排序后 , 得到最多匹配的括号个数 分析: 我们很容易的想到 字符串)()()(( , 这样的字符串可以精简为)(( ...

  9. BZOJ - 2457 思維+貪心

    //為什麼我的Chrome OS更新後變成強制繁體了?? 題目要求使用最少的雙端隊列來維護一個單調非降序列 先來看下規律 首先,val肯定是單調非降的,在相等val範圍內的id可以xjb亂放不影響 其 ...

  10. phpstorm 2017 关掉变量提示 parameter name hints

    配置面板中搜索 hints 路径 Editor > General > Appearance > Show parameter name hits 去掉前面的勾就行了