ES6 (5) 解构赋值

解构,一种黑魔法 解构是从对象中提取出更小元素的过程。赋值是对解构出来的元素进行重新赋值。 下面的代码你可能无法在浏览器上实时测试,推荐在babel官网在线测试代码:Try It Out 解构的分类 1、对象解构 2、数组解构 3、混合解构 4、解构参数 对象解构 对象解构简单的例子 let obj = { a: 1, b: [1, 2] } // 对象解构 const { a, b } = obj console.log(a, b) //1 [1, 2] 在函数中使用解构赋值 解构是将对象或者数组的元素一个个提取出来,而赋值是给元素赋值,解构赋值的作用就是给对象或者数组的元素赋值。 在调用t …

ES6 (4) 扩展对象的功能性

对象类别 在ES6中,对象分为下面几种叫法。(不需要知道概念) 1、普通对象 2、特异对象 3、标准对象 4、内建对象 对象字面量语法拓展 随便打开一个js文件,对象都无处不在,看一个简单的对象。 { a: 1 } ES6针对对象的语法扩展了功能 1、属性初始值简写 //ES5 function a(id) { return { id: id }; }; //ES6 const a = (id) => ({ id }) 更多说明:?https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/Obj …

ES6 (3) 函数

函数的默认参数 在ES5中,我们给函数传参数,然后在函数体内设置默认值,如下面这种方式。 function a(num, callback) { num = num || 6 callback = callback || function (data) {console.log(‘ES5: ‘, data)} callback(num * num) } a() //ES5: 36,不传参输出默认值 //你还可以这样使用callback a(10, function(data) { console.log(data * 10) // 1000, 传参输出新数值 }) 而在ES6中,我们使用新的默 …

ES6 (2) 字符串和正则表达式

本章主要讲2个知识点,字符串、正则表达式 字符串 字符串(String)是JavaScript 6大原始数据类型。其他几个分别是Boolean、Null、Undefined、Number、Symbol(es6新增)。 字符串类型在前端开发者,是使用最频繁的类型之一,网站上可见的各种文案,几乎都是字符串类型的数据。我们经常需要使用的操作无非是这么几点:读取字符串、转换字符串、清空字符串、拼接字符串、截取字符串。 在ES5中,字符串类型已经有了非常丰富的应用能力,那么,在ES6中,ECMA的专家们对字符串做了什么更新呢? 当Unicode引入扩展字符集之后,16位的字符已经不足以满足字符串的发展, …

ES6 (1) 块级作用域绑定var、let、const

本章涉及3个知识点,var、let、const,现在让我们了解3个关键字的特性和使用方法。 var JavaScript中,我们通常说的作用域是函数作用域,使用var声明的变量,无论是在代码的哪个地方声明的,都会提升到当前作用域的最顶部,这种行为叫做变量提升(Hoisting) 也就是说,如果在函数内部声明的变量,都会被提升到该函数开头,而在全局声明的变量,就会提升到全局作用域的顶部。 function test() { console.log(‘1: ‘, a) //undefined if (false) { var a = 1 } console.log(‘3: ‘, a) //unde …

RAP2搭建教程(mock服务)

RAP是一个可视化接口管理工具 通过分析接口结构,动态生成模拟数据,校验真实接口正确性, 围绕接口定义,通过一系列自动化工具提升我们的协作效率。 1.后端服务搭建 下载项目:?https://github.com/thx/rap2-delos 开发模式 # 创建数据库 mysql -e ‘CREATE DATABASE IF NOT EXISTS RAP2_DELOS_APP DEFAULT CHARSET utf8 COLLATE utf8_general_ci’ # 安装依赖初始化数据库 npm install npm run create-db # 代码检查(或可忽略) npm run …

pro.ant.design组件库搭建

国内npm较慢,安装淘宝镜像 npm install -g cnpm –registry=https://registry.npm.taobao.org 使用命令行工具 你可以使用集成化的命令行工具?ant-design-pro-cli。 cnpm install ant-design-pro-cli -g pro new # 安装脚手架 选择?standard 进入安装创建的项目目录执行 cnpm install 开发模式调试 cnpm start 打包路径配置,修改 .roadhogrc?文件,追加??publicPath?属性,为 build?依赖路径前缀 打包成生产版本 cnpm r …

JSX语法入门 基于React-16.0.0

JSX语法,像是在Javascript代码里直接写XML的语法,实质上这只是一个语法糖,每一个XML标签都会被JSX转换工具转换成纯Javascript代码,React 官方推荐使用JSX, 当然你想直接使用纯Javascript代码写也是可以的,只是使用JSX,组件的结构和组件之间的关系看上去更加清晰。 //使用JSX ReactDOM.render( <div> <div> <div>content</div> </div> </div>, document.getElementById(‘example’) ); / …