代码之家  ›  专栏  ›  技术社区  ›  Andrew Li

javascript回调函数类型:function()vs()=>[重复]

html jquery javascript
  •  2
  • Andrew Li  · 技术社区  · 8 年前

    这个问题已经有了答案:

    我有一些关于jquery中回调函数类型的问题。
    我对javascript不太了解。
    这里是文档级的简单代码。 

    $("input").change(function(){
  console.log(this);
});

    和 

    $("input").change(()=>{
  console.log(this);
});

    这些日志结果如下。
    第一个控制台日志是激发更改事件的输入的对象。
    第二个是整个文档。 function()和()=>{}有什么区别?
    请帮帮我。
    谢谢。
    我附加了简单的测试源代码。 

    <html>

<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<script>
  $(document).ready(function(){
	console.log("init");
	$(".first").change(function(){
		console.log(this);
	});
	$(".second").change(()=>{
		console.log(this);
	});
  });
</script>
</head>
<body>
    <input type="text" class="first" />
    <input type="text" class="second" />
</body>
</html>
    1 回复  |  直到 8 年前
        1
  •  1
  •   TwiN Alireza Fattahi    8 年前

    正确的术语 ()=>{} 是 箭头函数 ,有时也称为 胖箭头函数 .

    箭头函数表达式的语法比函数短 表达式没有自己的this、arguments、super或 新目标。这些函数表达式最适合于非方法 函数,它们不能用作构造函数。

    reference

    另外,请参见 Arrow function vs function declaration / expressions: Are they equivalent / exchangeable?

    为了更深入地解释几个例子,您可以阅读 this article .

    推荐文章
    code-geek  ·  Jquery根据单选按钮选择隐藏或显示文本字段
    1 年前
    Jamie  ·  在CSS链接的文件名中添加Jinja占位符
    1 年前
    ptownbro  ·  重叠分区标签,同时保持以下所有分区和内容就位
    1 年前
    Luke Frost IEng MIMechE  ·  Bootstrap 5.3在Div中的项目位置没有如我所期望的那样显示
    1 年前
    Reegan  ·  使用Angular ngFor指令在html中渲染嵌套对象值
    1 年前
    wqyutv  ·  当找不到文件时,任何破坏错误的东西都不会出现,我该怎么解决这个问题?
    1 年前
    user29519291  ·  为不同的变量创建一个带有可重用Click函数的简单菜单
    1 年前
    Gukkey  ·  在React中明确隐藏日期类型输入后,如果我单击父div,如何显示日期选择器?
    1 年前
    Lorenzo Bertolaccini  ·  在Angular项目中通过对话框后,在控制台中显示但在HTML中不显示的数据数组
    1 年前
    john Rizzo  ·  按钮背景颜色、悬停和活动状态存在问题
    1 年前
    关于   移动版
    代码之家 - 一站式码农服务社区
    沪ICP备11025650号