JS中fn的类型判断是否等于函数？

本文共计645个文字，预计阅读时间需要3分钟。

在观察他人代码时，我发现一种写法：`function() { fnfn() }`。其大致意思是这样的，但我觉得这样写似乎没有意义。能否指明一下 `fn` 不存在会有什么后果？不会报错，但似乎什么也不做。

我在看别人代码的时候，有看到代码是这样写的

function(){
fn&&fn()
}

大概意思是这么个意思，但是这我感觉这样写好像没意义，有带佬能指点一下吗

fn 不存在就什么都不做，不会报错，fn 存在才尝试执行 fn

一般来说fn && fn()就如同下面的语句

if (fn) { fn() }

一般来说函数的动态调用，因为不知道这个函数确定存在才会这么判断

大部分情况是这个意思，如果 fn 是 undefined 就不执行 fn()。React 针对 optional callback 会这么写。

在 js 里面，这是标准的。大幅减少代码量，比三目运算更直接了当。别的语言大同小异：fn?.xx()

这样写思路是对的，实现是错误的，fn 可能存在，但是它可能不是 function，执行 fn() 一样会出错。

下面分享正确的写法

typeof fn === "function" && fn()

实际应用

function addScript (url, fn) { var script = document.createElement('script') script.setAttribute('type', 'text/javascript') script.setAttribute('src', url) script.setAttribute('async', 'async') document.getElementsByTagName('head')[0].appendChild(script) script.onload = function () { typeof fn === 'function' && fn() } }

小结

正确写法应该时这个吧：typeof(fn)==='function' && fn()，不过通常约定 fn&&fn() 传递的一定是函数

这个就是 js 逻辑运算符的魔法：
当多个 &&串联时，执行到第一个 truthy 的表达式；
当多个||串联时，执行到第一个 false-thy 的表达式；
但我比较赞同王垠博客上的观点：短路机制是给程序优化执行效率的，不是给程序员拿来炫技的。

更多的可以查看这篇文章：

就是?.操作符，不包括方括号，我把引号打成方括号了。
可以参见这里：

developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Optional_chaining

进入可以选择简体中文。