// 定义一个支持传入回调函数的函数 function fun1(callback) { // 执行传入的函数，并将值2333作为参数传入 callback(2333) } // 执行定义的函数 fun1(function(res){ // 输出传入的参数 console.log(res) })
预备知识（如何把回调函数改为Promise）
这里只是为了举个例子，不涉及错误处理的时候，不建议修改为Promise。
function fun2() { // 在函数中返回一个Promise对象 // resolve和reject都是函数 return new Promise(function(resolve, reject){ // resolve函数中的参数将会出现在.then方法中 // reject函数中的参数将会出现在.ctch方法中 resolve(2333) }) } fun2().then(function(res){ console.log(res) // 2333 })
开始修改
Promise是通过resolve和reject来分别把正确结果，和错误提示放在链式调用的.then和.catch方法里。
const examStart2 = function() { // 返回一个Promise对象 return new Promise(function(resolve, reject) { var result = prompt('1+5=') if(result === '6') { resolve('Awesome. Your answer is ' + result) } else { reject('You can try again. Your answer is ' + result) } }) } examStart2() .then(function(res) { console.log(res) }) .catch(function(err) { console.log(err) })
修改成箭头函数（Arrow Function）
预备知识（箭头函数是什么）
箭头函数是一个用来帮我们简化函数结构的一个小工具。
// 普通函数形式 const add1 = function(a, b) { return a + b } add1(1, 2) // 3 // 箭头函数形式 const add2 = (a, b) => a + b add2(1, 2) // 3
预备知识（箭头函数函数中的this是个坑）
// 箭头函数没有独立的this作用域 const obj1 = { name: 'bw2', showName: () => { return this.name } } obj1.showName() // "" // 解决方案：改为function模式 const obj2 = { name: 'bw2', showName: function() { return this.name } } obj2.showName() // "bw2"
开始修改
var examStart3 = function() { // 修改一 return new Promise((resolve, reject) => { var result = prompt('1+5=') if(result === '6') { resolve('Awesome. Your answer is ' + result) } else { reject('You can try again. Your answer is ' + result) } }) } // 修改二 examStart3().then((res) => console.log(res)).catch((err) => console.log(err))
修改拼接字符串成模板字符串
预备知识（字符串的拼接方式）
const xh1 = 'xiaohong' console.log('I\'m ' + xh1 + '.') // I'm xiaohong.
预备知识（改为模板字符串的方式）
字符串模板使用的不再是单引号了，是在英文输入状态下的`键（ESC下面那个）。
const xh2 = 'xiaohong' console.log(`I'm ${xh2}.`) // I'm xiaohong.
开始修改
var examStart4 = function() { return new Promise((resolve, reject) => { var result = prompt('1+5=') if(result === '6') { // 修改一 resolve(`Awesome. Your answer is ${result}`) } else { // 修改二 reject(`You can try again. Your answer is ${result}`) } }) } examStart4().then((res) => console.log(res)).catch((err) => console.log(err))
修改成解构的对象
对象解构常用在NodeJS导入包内的某个模块时。对于自己写的对象，如果需要进行解构，则要确保对象内的命名被解构出来不会造成冲突。这里是为了举例子方便，没有使用很独特的命名。
const People2 = function(name, age) { this.name = name this.age = age } const xiaoming2 = new People2('xiaoming2', 18) // 开始结构 const {name, age} = xiaoming2 // 现在可以独立访问了 console.log(name) // xiaoming2 console.log(age) // 18
修改成Class
类是一个语法糖，但是这并不妨碍我们去食用他。
在React中，模板的定义，通常是类，生命周期方法也是写在类中。
class People3 { constructor(name, age){ this.name = name this.age = age } showName() { return this.name } } const xiaoming3 = new People3('xiaoming3', 18) console.log(xiaoming3) // People {name: "xiaoming3", age: 18} console.log(xiaoming3.showName()) // xiaoming3
不过瘾？文章已经结束了。但是关于ES6的探索，还会继续保存更新。
以上这篇把JavaScript代码改成ES6语法不完全指南(分享)就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。
您可能感兴趣的文章: