javaScript原生复习

一、函数的定义方式

1. 函数声明:

function 函数名() {
   //...
}

特点：无论在函数定义前，还是函数定义后调用，都能执行
为什么都能执行？？？
因为函数声明方式：函数提升

2.函数表达式：

var 变量名=function() {
   //....
}
变量名()
特点：只能在函数定义后调用，才能执行

二、this指向问题

1、普通函数this指向

函数的this指向遵循一个基本原则：谁调用的函数，函数的this就指向谁，否则指向全局

2、箭头函数this指向

先我们要知道，箭头函数本身是没有 this，箭头函数 this 是定义箭头函数时父级作用域的 this，也就是说使用箭头函数时，箭头函数内部的 this，我们只需要看定义该箭头函数时，该箭头函数父级的 this

3、使用call、apply指定this

call和apply的功能一样，只是参数不同。call是列举出所有参数，而apply是以将参数放入数组，以数组的形式传递。

三、new 函数，访问原型上方法

今天小编做了一道针对this指向比较绕的题，javaScript不熟练的要多看，多练习，题目如下：

题目一：

//定义一个Foo函数
function Foo() {
 getName = function () { alert(1) };
 return this;
}
Foo.getName = function () { alert(2) };
Foo.prototype.getName = function () { alert(3) };
//函数表达式
var getName = function () { alert(4) }
//函数声明
function getName() { alert(5) }
请写出输出结果：
Foo.getName() 
getName() 
Foo().getName() 
getName()  
new Foo.getName()  
new Foo().getName() 
new new Foo().getName() 

注：题目的答案小编放到博客结尾，可以参照对比。

四、javaScript异步

1、同步和异步的区别

js是单线程的，只能处理完一件事再做另外一件事，但是设想如果前面一件事花费的时间特别长，我们就只能一直等着他，就会阻塞下面的进程，这样程序运行时间增长，就会降低用户体验。
同步：按照一定的顺序去执行，执行完一个才能执行下一个
异步：执行顺序是不确定的，由触发条件决定，什么时间执行也是不确定的，即使是定时器，异步处理可以同时执行多个。

注：异步的应用场景

1.数据请求（ajax）
2.DOM操作:例如：点击事件
3. 定时器操作：setTimeout,setInterval

管理异步

1.回调函数
2.Promise
3.async/await

这道题是针对javaScript同步异步的一道题目，答案也会放到博客结尾，题目如下：

async function async1(){
    console.log('async1 start')   
    await async2() 
    console.log('async1 end')    
}
async function async2() {
    console.log('async2')       
}
console.log('script start')    

setTimeout(() => { 
    console.log('setTimeout')   
});

async1()

new Promise((resolve=>{
    console.log('promise1')  
    resolve()
})).then(function () { 
    console.log('promise2')  
})
console.log('script end')     
根据题目看后台先输出哪一个？

注：异步：分宏任务代码和微任务代码(详细了解查一下event loop)

宏任务：

setTimeout
setInterval
setImmediate (Node独有)
requestAnimationFrame (浏览器独有)
I/O
UI rendering (浏览器独有)

微任务：

process.nextTick (Node独有)
async/await
Promise
Object.observe
MutationObserver

第一题答案：

Foo.getName() //打印出2
getName()  //打印出4
Foo().getName()  //打印出1
getName()  //打印??? 1
new Foo.getName()  //打印？？？2
new Foo().getName()  //打印?? 3
new new Foo().getName()  //打印？？3

第二题答案：

运行结果：
1. script start
2. async1 start 
3. async2
4. promise1
5. script end
6. async1 end
7. promise2
8. setTimeout