4.JS高级和promise

一、函数表达式（匿名函数）

其实匿名函数和普通函数没有什么特别大的差异，只是写法上不同

const test = function() {
        console.log('hello world')
}

test()

二、箭头函数

1.没有参数的箭头函数

test = () => console.log('这是最简单的箭头函数')
test()

2.单参箭头函数

test = x => console.log('x =  ' + x)
test(10)

3.多参数箭头函数

多参箭头函数参数的小括号就不能省略了

test = (x,y) => console.log('x =  ' + x,'y = ' + y)
test(10,20)

4.函数体只有一行内容

如果只有一行语句，可以同时省略大括号和return。

test = () => 10 + 10
console.log(test()

5.函数体有多行

如果函数体部分有多行，就需要使用{}，如果有多上的话，其实就没必要使用箭头函数了

test = () => {console.log('1'),console.log('2')}
test()

6.return和{}必须并存

test = () =>  {return 10 + 20}
x = test()
console.log(x)

注意：在js中会有很多情况会使用匿名的箭头函数作为函数的参数，下边的定时器

四、定时器

1.setInterval

主要作用是循环

格式：
setIneterval(箭头函数，间隔时间)

实例：
每1秒钟执行一次输出hello world
setInterval(
        ()=>{
                console.log('hello world')
        },1000
)

2.setTimewait

主要作用是在指定时间之后

格式：
setIneterval(箭头函数，等待时间)

1秒中之后输出hellO world 然后结束
setTimeout(
        ()=>{
                console.log('hello world')
        },1000
)

五、promise简介

promise是一门新的技术（ES6规范）。promise主要是解决了异步编程的新解决方案

优点：
1.指定回调函数的方式更加灵活
2.支持链式调用，可以解决回调地狱问题（回调函数嵌套调用）

1.语法格式

const 对象名称 = new Promise(
        (函数名1，函数名2)=>{
                逻辑代码
        }
)

对象名称.then(
        箭头函数1，箭头函数2
)

2.实例

const num = 2
const p = new Promise(
            //当然，这里的resolve和reject 可以自定义名称，只是默认名称这么写
        (resolve,reject)=>{
                if (num > 5){
                        resolve()  //执行此函数会将promise对象设置为成功状态
                }
                else{
                        reject()   //执行此函数会将promise对象设置为失败状态
                }
        }
)
//promise对象会有一个then方法，then有两个函数参数，一个是promise对象成功的函数，另一个是失败的函数
p.then(
        ()=>{
                console.log('成功了!')   //如果promise对象是成功状态就执行此箭头函数
        },
        ()=>{
                console.log('失败了!')   //如果promise对象是失败状态就执行此箭头函数
        }
)

执行结果

[root@node-2 ~]# node  test.js 
失败了!

将num的值改成7，执行结果如下

[root@node-2 ~]# node  test.js 
成功了!

3.传参

resolve函数会把参数传给then的形参中的value参数

const p =  new Promise(
        (resolve,reject) => {
                resolve({"username": "zhangsan","age": 20})
        }
)
p.then(
        (value)=>{
                console.log(value)
        }
)

[root@node-2 ~]# node  test.js
{ username: 'zhangsan', age: 20 }

4.async和await函数

在promise对象的then函数来接收 resolve传递过来的值。如果想要在其它函数中接收Promise对象的值怎么办呢!这就需要用到了async和await函数
await函数必须要在async函数中。sync函数中可以不出现await函数

实例：

const p = new Promise(
        (resolve,reject)=>{
                setTimeout(
                        ()=>{
                                resolve({"username":"zhangsan","age":20})
                        },3000
                )
        }
)

async function test(){
        const rest =  await p
        console.log('rest的值为:' + rest)
}
test()
console.log('------------')

[root@node-2 ~]# node test.js 
------------
值为: { username: 'zhangsan' }

结果说明的问题:

1.首先resolve是在3秒钟之后才执行的，但是整体程序没有在阻塞。
2.只有test函数在同步等待promise对象执行之后继续运行test函数，阻塞范围只有test函数
3.promsie对象给其它函数传递了数据