of course not. Human flesh will know it in one step. Skip the declaration and enter from fun (1)
. Please follow the serial number
.
function newFun(a) { // 2-1: newFun
return function(a) { // 3: a
console.log(a);
}
// 4-0: newFun
}
function fun(a) { // 0-1: fun1
console.log(a); // 1: a1
newFun(a => { // 2-0: newFun
console.log(a);
});
// 4-1: newFun
// 5-0: fun
}
fun(1); // 0-0: fun1
// 5-1: fun
you can see that 1
is printed only once from beginning to end, and only the first console.log (a)
in the function fun
is executed, as the other two console.log (a)
are in two functions as arguments and return values, respectively, but are not called. To make these two console.log (a)
be executed, simply call the function to which they belong
function newFun(a) { // 3-1: newFun
return function(a) { // 4: a
console.log(a);
}
// 5-0: newFun
}
function fun(a) { // 0-1: fun1
console.log(a); // 1: a1
let brandNewFun = a => console.log(a);
brandNewFun(a); // 2: brandNewFuna1
newFun(brandNewFun)(a); // 3-0: newFunbrandNewFun
// 5-1: newFuna11
// 6-0: fun
}
fun(1); // 0-0: fun1
// 6-1: fun
can be changed to this (a little perverted):
function newFun(a){
return function(a){
console.log("3->"+a)
}
}
function fun(a) {
console.log("1->"+a)
newFun(((a)=>{
console.log("2->"+a)
})(a))(a)
}
fun(1);
run results
1->1
2->1
3->1
certainly will not output three 1s. First, the arrow function does not execute the parameter, and secondly, the a value after execution in the arrow function also needs to be returned, otherwise undefined, can look at where a comes from:
.
function newFun(a){
console.log(`C: ${a}`);
return function(j){
console.log(`D: ${j}`);
}
}
function fun(a) {
console.log(`A: ${a}`);
newFun(((i)=>{
console.log(`B: ${i}`);
return i;
})(a))(a)
}
fun(1)
steps for major changes are:
function newFun(a){
return (a => {console.log(a + ">>>3")})(a);
}
function fun(a) {
console.log(a + ">>>1"); //1
newFun( (a => {console.log(a + ">>>2");return a})(a));
}
fun(1);
may be more roundabout. You can take a good look at the explanation on the first floor
.
//Thunk
function newFun(...args){
return function(fn){
console.log(...args)
return fn.call(this,...args)
}
}
function fun(a) {
console.log(a)
newFun(a)((a)=>{
console.log(a)
})
}
fun(1)
function fun(a) {
console.log(a)
return function(a) {
console.log(a)
}
}
fun(1)
seems to have finally executed a console.log.
function newFun (a) {
console.log(a)
return function(a){
console.log(a)
}
}
function fun (a) {
console.log(a)
newFun(a)(a)
}
fun (1)
the original code does not output 1 3 times.
the following is an analysis of the execution process, which is manually diff to make it easy to see what changes have been made to the original code.
function newFun(a) {
+ a() // 3: aa2newFun
return function(a) { // 5:
console.log(a) // 7: 1anewFunaa6
}
}
function fun(a) {
console.log(a) // 1: 1
- newFun((a)=>{
- console.log(a)
- })
+ newFun(()=>{ // 2: newFunnewFun
+ console.log(a) // 4: 1
+ })(a) // 6: newFun5aa1
}
fun(1) // 0: fun
the following code can be copied directly for those who want to interrupt to learn about the execution process.
function newFun(a) {
a() // 3: aa2newFun
return function(a) { // 5:
console.log(a) // 7: 1anewFunaa6
}
}
function fun(a) {
console.log(a) // 1: 1
newFun(()=>{ // 2: newFunnewFun
console.log(a) // 4: 1
})(a) // 6: newFun5aa1
}
fun(1) // 0: fun