对于在JavaScript中更改this指向的3个方法bind,apply,call中的一些问题

新手上路,请多包涵

如图代码所
在传入一个函数前加~并声明一个变量return会返回一个-1,声明一个变量并return则会返回一个-1-参数
在传入一个函数前加!并声明一个变量return会返回一个false,如果把return注释则会返回一个true
同理如果前面变成+或者-号会返回NaN
这是我在学习尝试的时候发现的,希望可以帮忙解决

阅读 1.2k
2 个回答

+-~都是运算符,然后去计算匿名函数的返回值undefined,计算出了NaN或者-1,使用!转换undefined,变成了true

如果你不想他进行运算,就要换一种匿名函数的写法,比如

(function(){
    return xx
}())

或者

(function(){
    return xx
})()
已参与了 SegmentFault 思否社区 10 周年「问答」打卡 ,欢迎正在阅读的你也加入。
参考阅读
  • function() { let c = -5; return c }() 的执行结果是 -5
  • ~(-5) 的结果是 4

所以 fn.call(a, { cc: "dd" }, ~function() { let c = -5; return c }()) 相当于

fn.call(a, { cc: "dd" }, 4)
//      ^ -> this
//         ^^^^^^^^^^^^ -> a
//                       ^ -> b

这里没有给 c 参数,所以按打印出来就是图中第一行输出

第二个调用中的 !function() {} 返回是 undefined!undefined 是逻辑运算(布尔运算),undefinedfalsy 值,所以取返得到 true

那个调用相当于 fn.apply(a, [99, { aa: "bb" }, true]),也有对等的 call 表示

fn.apply(a, [99, { aa: "bb" }, true])
//       ^ -> this
//           ^^ -> a
//               ^^^^^^^^^^^^ -> b
//                             ^^^^ -> c

fn.call(a, 99, { aa: "bb" }, true)
//      ^ -> this
//         ^^ -> a
//             ^^^^^^^^^^^^ -> b
//                           ^^^^ -> c

已参与了 SegmentFault 思否社区 10 周年「问答」打卡 ,欢迎正在阅读的你也加入。
推荐问题
宣传栏