javascript线程机制和回调(我同事打了一把王者时间)
javascript线程机制和回调(我同事打了一把王者时间)说明:当输出调用 add 函数的时候,js 代码从上到下执行,当遇到异步的 setTimeout 函数的时候,不会等待异步函数,继续往下执行,当执行 console.log(add(10 20)); 的时候,函数没有返回值,所以打印出 undefined。function add(x y){ console.log(1); setTimeout(function(){ console.log(2); var result = x y; return result; } 1000); console.log(3); }; console.log(add(10 20));运行结果:案例二:定义一个函数 add,也是接收两个参数,在这个 add 函数中同时定义了一个 setTimeout 函数,想在一秒
回调函数定义:回调函数就是一个通过函数指针调用的函数。如果你把函数的指针(地址)作为参数传递给另一个函数,当这个指针被用来调用其所指向的函数时,我们就说这是回调函数。
案例案例一:定义一个名为 add 的函数,接收两个参数,将这个两个参数相加,作为返回值。当调用这个函数的时候,就可以得到返回值。
function add(x y){
return x y;
};
var result = add(10 20);
console.log(result);
运行结果:
说明:像上面的 add 函数,可以直接得到返回值。
案例二:定义一个函数 add,也是接收两个参数,在这个 add 函数中同时定义了一个 setTimeout 函数,想在一秒钟之后,返回这两个参数之和。
演示两种获取不到的方法:
第一种:在 setTimeout 中返回结果
function add(x y){
console.log(1);
setTimeout(function(){
console.log(2);
var result = x y;
return result;
} 1000);
console.log(3);
};
console.log(add(10 20));
运行结果:
说明:当输出调用 add 函数的时候,js 代码从上到下执行,当遇到异步的 setTimeout 函数的时候,不会等待异步函数,继续往下执行,当执行 console.log(add(10 20)); 的时候,函数没有返回值,所以打印出 undefined。
第二种:在外层函数定义一个 result 变量,在 setTimeout 函数里进行赋值。
function add(x y){
var result = 0;
setTimeout(function(){
result = x y;
} 1000);
return result;
};
console.log(add(20 20));
运行结果:
说明:js 代码按照顺序执行,当执行到 setTimeout 的时候,不会等待,继续往下执行,所以 result 还是 0。
正确的获取方式:通过定义回调函数获取function add(x y callback){
setTimeout(function(){
var result = x y;
callback(result);
} 1000);
};
add(30 20 function(result){
console.log(result);
});
运行结果:
说明:add 函数中的 callback,只是起的名称,意思是 回调函数,在输出调用 add 函数的时候,传了 x,y 和 一个函数,其实就是将函数的指针(地址)作为参数传递给另一个函数,当这个指针被用来调用时,就是去找 function(result){console.log(result)}。所以在调用add 函数的时候,代码按照正常顺序执行,过了 1 秒之后,执行 setTimeout 里的函数,执行到 callback 的时候,会去执行function(result){console.log(result)}。
路漫漫其修远兮,吾将上下而求索
译文:在追寻真理方面,前方的道路还很漫长,但我将百折不挠,不遗余力地去追求和探索。
如果您有什么好的想法与方法,欢迎在评论区留言,我们一起讨论~