基于ES6作用域和解构赋值详解
时间:2019-04-07
本文章向大家介绍基于ES6作用域和解构赋值详解,主要包括基于ES6作用域和解构赋值详解使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
ES6 强制开启严格模式
作用域
•var 声明局部变量,for/if花括号中定义的变量在花括号外也可访问
•let 声明的变量为块作用域,变量不可重复定义
•const 声明常量,块作用域,声明时必须赋值,不可修改
// const声明的k指向一个对象,k本身不可变,但对象可变 function test() { const k={ a:1 } k.b=3; console.log(k); }
test()解构赋值
{ let a, b, 3, rest; [a, b, c=3]=[1, 2]; console.log(a, b); } //output: 1 2 3 { let a, b, 3, rest; [a, b, c]=[1, 2]; console.log(a, b); } //output: 1 2 undefined { let a, b, rest; [a, b, ...rest] = [1, 2, 3, 4, 5, 6]; console.log(a, b, rest); } //output:1 2 [3, 4, 5, 6] { let a, b; ({a, b} = {a:1, b:2}) console.log(a ,b); } //output: 1 2
使用场景
变量交换
{ let a = 1; let b = 2; [a, b] = [b, a]; console.log(a, b); }
获取多个函数值
{ function f(){ return [1, 2] } let a, b; [a, b] = f(); console.log(a, b); }
获取多个函数返回值
{ function f(){ return [1, 2, 3, 4, 5] } let a, b, c; [a,,,b] = f(); console.log(a, b); } //output: 1 4 { function f(){ return [1, 2, 3, 4, 5] } let a, b, c; [a, ...b] = f(); console.log(a, b); } //output: 1 [2, 3, 4, 5]
对象解构赋值
{ let o={p:42, q:true}; let {p, q, c=5} = o; console.log(p ,q); } //output: 42 true 5
获取json值
{ let metaData={ title: 'abc', test: [{ title: 'test', desc: 'description' }] } let {title:esTitle, test:[{title:cnTitle}]} = metaData; console.log(esTitle, cnTitle); } //Output: abc test
以上这篇基于ES6作用域和解构赋值详解就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。
- CoreOS etcd3 集群实践
- Spring MVC学习教程之流程表单提交,3步实现这个功能
- PXE 模式启动 CoreOS
- iPXE 模式启动 CoreOS(简单、推荐使用)
- CoreOS 已废弃组件
- Docker Compose version 3 使用详解
- Virtualbox 安装 Alpine Linux
- LinuxKit 使用
- Docker 实践遇到的问题(持续更新)
- GitHub Pages 常见问题
- SpyDealer深度剖析:一个广泛针对中国手机APP进行信息窃取的恶意软件
- Docker + Drone CI/CD 实践
- Petya及Notpetya的核心差异分析
- macOS aria2 命令行使用详解
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- Android10自动连接WiFi问题的解决
- Android写一个实时输入框功能
- android自定义view用path画长方形
- 机器学习:如何快速从Python栈过渡到Scala栈
- Android studio实现加法软件
- 解决php extension 加载顺序问题
- Android 获取drawable目录图片 并存入指定文件的步骤详解
- php基于 swoole 实现的异步处理任务功能示例
- PHP中Session ID的实现原理实例分析
- php5.6.x到php7.0.x特性小结
- android自定义加减按钮
- php链式操作的实现方式分析
- php中的依赖注入实例详解
- Android通知栏前台服务的实现
- Laravel 默认邮箱登录改成用户名登录的实现方法