React组件内无声明关键字Lambda函数的语法特性问题咨询
1. 无声明关键字赋值的语法正式名称
这种写法正式叫做隐式全局赋值(Implicit Global Assignment),不属于JS官方推荐的变量声明语法,是非严格模式(Sloppy Mode)下的历史遗留行为。
当给一个未通过var/let/const声明的标识符直接赋值时,JS引擎不会抛出语法错误,反而会自动在全局作用域下创建同名全局属性/变量,该变量的作用域完全脱离当前代码块,属于全局污染。
结合你给出的React代码补充说明:你在函数组件内部写的OnClick = (input) => {},实际是在浏览器全局对象window上创建了名为OnClick的属性,根本不是定义在当前组件作用域内。后续用this.OnClick也无法正确获取——因为函数组件本身没有类组件的实例this上下文,非严格模式下此处this默认指向window,即使碰巧取到全局的OnClick,写法也完全不符合React组件开发规范。
2. 该特性所属的ECMAScript版本
隐式全局赋值是1997年发布的第一版ES1标准就已存在的行为,并非后续版本新增的语法特性。
直到ES5(2009年发布)正式引入严格模式('use strict')后,这种隐式全局赋值的写法会直接抛出ReferenceError,被官方明确禁止。当前所有现代前端开发环境(包括React默认构建配置)默认开启严格模式,正常情况下这种写法直接报错,只有手动关闭严格模式的老旧环境才能运行。
3. 该写法是否仅适用于Lambda函数场景
完全不限制赋值内容类型,和赋值是否为Lambda函数没有任何关系。
只要给未声明的标识符赋值,无论赋的是数字、字符串、普通函数、对象、类实例等任意类型的值,都会触发隐式全局赋值行为,示例:
function test() { num = 123; // 自动创建全局window.num obj = { name: "demo" }; // 自动创建全局window.obj regularFunc = function() {}; // 自动创建全局window.regularFunc }
所有上述写法都会触发相同的隐式全局行为,不存在仅针对Lambda函数的限制。
内容的提问来源于stack exchange,提问作者Martin Dallinger

