javascript 使用 匿名 箭头函数 this的变化
处理html 页面
<body>
<div class="main">
<div class="up">
<div class="black"></div>
</div>
<div class="down"></div>
<div class="disp"></div>
<input type="button" value="点击消失" onclick="abc()"> <div id="test1" class="tt">
<h1>abccccc</h1>
</div>
</div> <script>
function abc() {
let a = $('.tt')[0];
console.log(a);
let b = $("#test1");
console.log(b);
$('.tt').each((index,ele) => {
console.log(ele);
});
$('.main').delegate('#test1','click',() => {
console.log(this);
console.log($(this));
});
$('.main').delegate('#test1','click',function () {
console.log(this);
console.log($(this));
});
}
</script>
在使用jquery 给 class为main 元素的子元素添加点击事件
$('.main').delegate('#test1','click',() => {
console.log(this);
console.log($(this));
});
如果使用匿名箭头函数,this 指向了 window对象

使用正常写法的写法:

this的指向当前元素!
以前学习箭头函数,有讲到this的指向问题,真正的使用起来容易遗忘。
纸上得来终觉浅,绝知此事要躬行.
javascript 使用 匿名 箭头函数 this的变化的更多相关文章
- JavaScript 基础(七) 箭头函数 generator Date JSON
ES6 标准新增了一种新的函数: Arrow Function(箭头函数). x => x *x 上面的箭头相当于: function (x){ return x*x; } 箭头函数相当于匿名函 ...
- JavaScript中的箭头函数
1.定义 箭头函数相当于匿名函数,并且简化了函数定义.箭头函数有两种格式,一种像上面的,只包含一个表达式,连{ ... }和return都省略掉了.还有一种可以包含多条语句,这时候就不能省略{ ... ...
- JavaScript中的普通函数和箭头函数
最近被问到了一个问题: javaScript 中的箭头函数 ( => ) 和普通函数 ( function ) 有什么区别? 我当时想的就是:这个问题很简单啊~(flag),然后做出了错误的回答 ...
- [ES6系列-02]Arrow Function:Whats this?(箭头函数及它的this及其它)
[原创] 码路工人 大家好,这里是码路工人有力量,我是码路工人,你们是力量. 如果没用过CSharp的lambda 表达式,也没有了解过ES6,那第一眼看到这样代码什么感觉? /* eg.0 * fu ...
- JS中的普通函数和箭头函数
最近被问到了一个问题: >javaScript 中的箭头函数 (=>) 和普通函数 (function) 有什么区别? 我当时想的就是:这个问题很简单啊~(flag),然后做出了错误的回答 ...
- 深入理解JavaScript中的箭头
箭头函数可以使我们的代码更加简洁,如下: var sum = (a,b) => a+b; JavaScript 充满了我们需要编写在其他地方执行的小函数的情况. 例如: arr.forEach( ...
- JavaScript学习笔记(十二)——箭头函数(Arrow Function)
在学习廖雪峰前辈的JavaScript教程中,遇到了一些需要注意的点,因此作为学习笔记列出来,提醒自己注意! 如果大家有需要,欢迎访问前辈的博客https://www.liaoxuefeng.com/ ...
- JavaScript ES6 Arrow Functions(箭头函数)
1. 介绍 第一眼看到ES6新增加的 arrow function 时,感觉非常像 lambda 表达式. 那么arrow function是干什么的呢?可以看作为匿名函数的简写方式. 如: var ...
- javascript基础修炼(8)——指向FP世界的箭头函数
一. 箭头函数 箭头函数是ES6语法中加入的新特性,而它也是许多开发者对ES6仅有的了解,每当面试里被问到关于"ES6里添加了哪些新特性?"这种问题的时候,几乎总是会拿箭头函数来应 ...
随机推荐
- websocket协议及案例
WebSocket是一种用于在服务器与客户端之间实现高效的双向通信的机制.可以解决数据实时性要求比较高的应用,比如:在线聊天,在线教育,炒股或定位等. 一:websocket产生背景: 为了解决这种实 ...
- ORA-16014: log 3 sequence# 540 not archived, no available destinations
https://blog.csdn.net/zonelan/article/details/7329369
- Node.js 的安装
Node.js 是一个基于 Chrome V8 引擎的 JavaScript 的运行环境,简单的说就是运行在服务端的 JavaScript.所以学起来还是比较容易接受的. Node.js 使用事件驱动 ...
- LeetCode赛题393----UTF-8 Validation
393. UTF-8 Validation A character in UTF8 can be from 1 to 4 bytes long, subjected to the following ...
- 1 python使用networkx或者graphviz,pygraphviz可视化RNN(recursive)中的二叉树
代码地址https://github.com/vijayvee/Recursive-neural-networks-TensorFlow 代码实现的是结构递归神经网络(Recursive NN,注意, ...
- 软工读书笔记 week 1
这次读书笔记主要是就<程序员修炼之道>这本书的前半部分做一些总结以及发表一些自己的看法. 本书前面的一部分主要是一些程序员应该在工作中时刻注意的事情,一些关键的信息如下: 1.处理问题的态 ...
- Android自定义View之绘制虚线
现在实现一个效果,有个虚线分割和阴影效果.一个一个实现. 分为2中方式. 1.设计出图,我们SRC引入进来(最简单,但是需要其他资源支持). 2.code实现,有些难度,需要查资料. 现在把第2种方式 ...
- Sqlserver函数基础使用
函数基本功能: 转换工厂日期,将8点20之前的时间转化为前一天的时间. if exists (select * from sysobjects where xtype='fn' and name='F ...
- Java学习---JBPM[工作流]学习
点击参考 更多参考 链接:https://pan.baidu.com/s/1A1AH5sXu7yhV3mncpH4Z6w 密码:88zw
- Linux下php-fpm进程过多导致内存耗尽问题
这篇文章主要介绍了解决Linux下php-fpm进程过多导致内存耗尽问题,需要的朋友可以参考下 最近,发现个人博客的Linux服务器,数据库服务经常挂掉,导致需要重启,才能正常访问,极其恶心,于是 ...