javascript - 我如何判断一个函数对象是否是用粗箭头表达式创建的?

标签 javascript

我正在创建一个函数,该函数将对象作为参数,并使用存储在该对象中的数据执行操作。我想做的一些事情涉及该对象中的函数。我想将它们中的大部分绑定(bind)到各种对象,但这不适用于使用 fat arrow syntax 创建的任何函数.所以,我想对他们做一些不同的事情。我如何区分它们?

注意:我知道普通函数有一个原型(prototype),但用粗箭头语法制作的函数没有,但我不能使用它,因为用 method syntax 制作的函数也没有原型(prototype),但它们可以绑定(bind),所以我想像对待其他函数一样对待它们。

最佳答案

你可以使用 Function#toString()检查函数的源代码,看看它是否被定义为箭头函数。

const foo = () => {};
const fooStr = Function.prototype.toString.call(foo);
const isArrow = fooStr.includes(') => {');

请注意,上面的实现对于大多数用例来说可能过于幼稚,因为它有一些误报和漏报。对于初学者,如果 foo 是一个包含箭头函数的普通函数(或者在它内部的任何地方都有那个特定的字符串),则 isArrow 将为 true ,比如评论等)

我们可以通过尝试特别匹配函数定义的头部来对此进行改进。下面,我通过搜索花括号 { 的第一次出现来执行此操作,这对于箭头函数和非箭头函数都是通用的。

const foo = () => {};
const fooStr = Function.prototype.toString.call(foo);
const curlyIndex = fooStr.indexOf('{');
const head = fooStr.substring(0, Math.max(curlyIndex, 0));
const isArrow = head.endsWith(') => {');

对我们来说不幸的是,圆括号和花括号实际上对于箭头函数都是可选的,它们甚至不需要任何空格。因此,理想情况下,我们需要一些能够在 foox=>x 时起作用的东西,例如。

const foo = x=>x;
const fooStr = Function.prototype.toString.call(foo);
const curlyIndex = fooStr.indexOf('{');
let isArrow = true;
if (curlyIndex >= 0) {
    const head = fooStr.substring(0, curlyIndex);
    isArrow = head.replace(/\s/g, '').endsWith('=>{');
}

上面的实现是半途而废,但当 foo 类似于 x => x + '{' 时,它仍然有误报。还有其他陷阱,所以不要以为它就此结束。字符串分析很难,尤其是当语法是可选的时。

您可以使用像 Esprima 这样的库, Acorn , 或 Cherow , 来解析字符串并更完美地识别代码是否是箭头函数,但这对你来说可能有点过头了。

为了让您了解它的外观,下面是 Cherow demo 的输出当我输入一个空箭头函数时:

{
    "type": "Program",
    "sourceType": "script",
    "body": [
        {
            "type": "ExpressionStatement",
            "expression": {
                "type": "ArrowFunctionExpression",
                "body": {
                    "type": "BlockStatement",
                    "body": []
                },
                "params": [],
                "id": null,
                "async": false,
                "generator": false,
                "expression": false
            }
        }
    ]
}

关于javascript - 我如何判断一个函数对象是否是用粗箭头表达式创建的?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48857827/

相关文章:

javascript - dojo 中 this.own() 方法的使用

javascript - 试图让击球检测适用于乒乓球。左桨不起作用

javascript - 动画功能不适用于每个元素

javascript - 通过 JavaScript 使用数值从下拉框中选择项目

javascript - 将转换添加到隐藏/显示 javascript dom

如果我提交使用当前 html 中的 ajax 响应附加的表单,javascript 验证失败

javascript - 带有 dotenv 和 TypeScript 的环境变量

javascript - express.static() 不提供非 "/"的路由器路径中公共(public)文件夹中的文件

javascript - 将 Javascript 链接到 HTML

javascript - React : e. target.getAttribute ("id") 有 20% 的时间有效?