题目
- 同步和异步的区别是什么?分别举一个同步和异步的例子
同步会阻塞代码执行,而异步不会
alert是同步、setTimeout 是异步
console.log(1)
setTimeout(function(){
console.log(2)
},0)
console.log(3)
setTimeout(function(){
console.log(4)
},1000)
console.log(5)
定时任务: setTimeout 、setTimeInterval
网络请求: ajax请求、动态<img>加载
事件绑定
共同点: 都需要等待
知识点
// 异步
console.log(100)
setTimeout(function(){
console.log(200)
},1000)
console.log(300)
// 对比同步
console.log(100)
alert(200) //1秒之后点击确认
console.log(300)
// 异步和同步的一个区别就是有没有阻塞程序的执行,
// 何时需要异步
在可能发生等待的情况
等待过程中不能像alert一样阻塞程序运行
因此,所有的“等待情况”都需要异步
//场景
定时任务: setTimeout 、setTimeInterval
网络请求: ajax请求、动态<img>加载
事件绑定
// ajax请求代码示例
console.log('start')
$.get('./data1.json', function(data1){
console.log(data1)
})
console.log('end')
// img
console.log('start')
var img = document.createElement('img')
img.onload = function(){
console.log('loaded')
}
img.src = '/xxx.png'
console.log('end')
// 事件绑定
console.log('start')
document.getElementById('btn1').addEventListener('click', function{
alert('clicked')
})
console.log('end')
console.log(100)
setTimeout(function(){
console.log(200)
})
console.log(300)
1.执行第一行,打印100
2.执行setTimeout后,传入setTimeout的函数会被暂存起来,不会立即执行(单线程的特定,不能同时干两件事)
3.执行最后一行,打印300
4.待所有的程序执行完,处于空闲状态,会立即看有没有暂存起来的要执行
4.发现暂存起来的setTimeout中的函数无需等待时间,就立即过来执行
其他知识
题目
function formatDate(dt){
if(!dt){
dt = new Date()
}
var year = dt.getFullYear()
var month = dt.getMonth()
var date = dt.getDate()
if(month< 10){
month = '0' + month
}
if(date< 10){
date = '0' + date
}
return year + '-' + month + '-' + date
}
var dt = new Date()
var formatDate = formatDate(dt)
console.log(formatDate)
var randon = Math.random()
var random = random + '0000000000'
var random = random.slice(0, 10)
console.log(random)
function forEach(obj, fn){
var key
if(obj instanceof Array){
// 准确判断是不是数组
obj.forEach(function(item, index){
fn(index, item)
})
} else {
// 不是数组就是对象
for(key in obj){
fn(key, obj[key])
}
}
}
var arr = [1,2,3]
forEach(arr, function(index, item){
console.log(index, item)
})
var obj = {x: 100, y: 200}
forEach(obj, function(key, value){
console.log(key, value)
})
知识点
Date.now() //获取当前时间毫秒数
var dt = new Date()
dt.getTime()
dt.getFullYear()
dt.getMonth()
dt.getDate()
dt.getHours()
dt.getMinutes()
dt.getSeconds()
获取随机数 Math.random()
// forEach 遍历所有元素
var arr = [1,2,3]
arr.forEach(function(item,index){
//遍历所有元素
console.log(index, item)
})
//every 判断所有元素是否都符合条件
var arr = [1,2,3]
var result = arr.every(function(item, index){
// 用来判断所有的数组元素,都满足一个条件
if(item < 4){
return true
}
})
console.log(result)
// some 判断是否有至少一个元素符合条件
// sort 排序
// map 对元素重新组装,生成新数组
var arr = [1,2,3,4]
var arr2 = arr.map(function(item, index){
// 将元素重新组装,并返回
return '<b>' + item + '</b>'
})
console.log(arr2)
// filter 过滤符合条件的元素
var arr = [1,2,3]
var arr2 = arr.filter(function(item, index){
// 通过某一个条件过滤数组
if(item >= 2){
return true
}
})
console.log(arr2)
var obj = {
x: 100,
y: 200,
z: 300
}
var key
for(key in obj){
// 注意这里的 hasOwnProperty
// 所有继承了 Object 的对象都会继承到 `hasOwnProperty` 方法。这个方法可以用来检测一个对象是否含有特定的自身属性
if(obj.hasOwnProperty(key)){
console.log(key, obj[key])
}
}
网友评论