4.JS基础知识-异步
4.1异步
题目:
同步和异步的区别是什么?分别举一个同步和异步的例子
一个关于setTimeout的笔试题
前端使用异步的场景有哪些?
知识点:
什么是异步(对比同步)
前端使用异步的场景
异步和单线程
console.log(1000)
setTimeout(function(){
console.log(200)
},1000)
console.log(300)
从上面代码看,如果同步执行,那么300就会被阻塞,这就是异步的好处。
何时需要异步:
1.在可能发生等待的情况
2.等待过程中不能像alert一样阻塞程序运行
3.因此,所有的“等待的情况”都需要异步
前端使用异步的场景:
1.定时任务:setTimeout,setInverval
2.网络请求:ajax请求,动态<img>
加载
3.事件绑定
//ajax请求代码示例
console.log('start')
$.get('./data1.json',function(data1){
console.log(data1)
})
console.log('end')
<img>
加载示例:
事件绑定示例:
也就是请求处理过程中,你不能闲着,会产生异步的请求,回头再处理,然后继续执行下面的请求。
同步阻塞示例:
console.log(1000)
alert(200)
console.log(3000)
上面就是同步阻塞示例,你不点击alert确认窗口,不会打印3000
4.2异步和单线程
同步和异步的区别是什么?分别举一个同步和异步的例子
同步会阻塞代码执行,而异步不会
alert是同步,setTimeout是异步
一个关于setTimeout的笔试题
1 3 5 2 4
前端使用异步的场景有哪些?
1.定时任务:setTimeout,setInverval
2.网络请求:ajax请求,动态<img>
加载
3.事件绑定
特点是:需要等待,而且因为JavaScript是单线程,所以需要异步
4.3日期和math
题目:
1.获取2017-06-10格式的日期
2.获取随机数,要求是长度一致的字符串格式
3.写一个能遍历对象和数组的通用forEach函数
知识点:
1.日期
2.Math
3.数组API
4.对象API
Date日期
Math
Math.random()
4.4数组和对象
数组:
forEach 遍历所有元素
every 判断所有元素是否都符合条件
some 判断是否有至少一个元素符合条件
sort 排序
map 对元素重新组装,生成新数组
filter 过滤符合条件的元素(保存符合条件的数组)
var arr = [1,2,3]
arr.forEach(function (item,index){
//遍历数组的所有元素
console.log(index,item)
})
var arr=[1,2,3]
var result = arr.every(function(item,index){
if(item<4){
//都要满足条件
return ture
}
})
console.log(result)
var arr=[1,2,3]
var result = arr.some(function(item,index){
//至少一个满足
if(item<2){
return ture
}
})
console.log(result)
var arr = [1,4,2,3,5]
var arr2 = arr.sort(function(a,b){
//从小到大
return a-b
//从大到小
return b-a
})
console.log(arr2)
var arr = [1,2,3,4]
var arr2 = arr.map(function(item,index){
//将元素重新组装,并返回
return '<b>' + item + '</b>'
})
consolelog(arr2)
var arr = [1,2,3]
var arr2 = arr.filter(function(item,index){
//通过设置条件,过滤符合条件的数据,保存符合条件的数组
if(item>=2){
return true
}
})
console.log(arr2) // [2,3]
对象API
for in遍历所有元素
var obj = {
x:100,
y:200,
z:300
}
var key
for (key in obj){
if(obj.hasOwnProperty(key)){
console.log(key,obj[key])
}
}
1.获取2017-06-10格式的日期
2.获取随机数,要求是长度一致的字符串格式
3.写一个能遍历对象和数组的通用forEach函数
总结:日期、Math、数组API、对象API