处理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的变化的更多相关文章

  1. JavaScript 基础(七) 箭头函数 generator Date JSON

    ES6 标准新增了一种新的函数: Arrow Function(箭头函数). x => x *x 上面的箭头相当于: function (x){ return x*x; } 箭头函数相当于匿名函 ...

  2. JavaScript中的箭头函数

    1.定义 箭头函数相当于匿名函数,并且简化了函数定义.箭头函数有两种格式,一种像上面的,只包含一个表达式,连{ ... }和return都省略掉了.还有一种可以包含多条语句,这时候就不能省略{ ... ...

  3. JavaScript中的普通函数和箭头函数

    最近被问到了一个问题: javaScript 中的箭头函数 ( => ) 和普通函数 ( function ) 有什么区别? 我当时想的就是:这个问题很简单啊~(flag),然后做出了错误的回答 ...

  4. [ES6系列-02]Arrow Function:Whats this?(箭头函数及它的this及其它)

    [原创] 码路工人 大家好,这里是码路工人有力量,我是码路工人,你们是力量. 如果没用过CSharp的lambda 表达式,也没有了解过ES6,那第一眼看到这样代码什么感觉? /* eg.0 * fu ...

  5. JS中的普通函数和箭头函数

    最近被问到了一个问题: >javaScript 中的箭头函数 (=>) 和普通函数 (function) 有什么区别? 我当时想的就是:这个问题很简单啊~(flag),然后做出了错误的回答 ...

  6. 深入理解JavaScript中的箭头

    箭头函数可以使我们的代码更加简洁,如下: var sum = (a,b) => a+b; JavaScript 充满了我们需要编写在其他地方执行的小函数的情况. 例如: arr.forEach( ...

  7. JavaScript学习笔记(十二)——箭头函数(Arrow Function)

    在学习廖雪峰前辈的JavaScript教程中,遇到了一些需要注意的点,因此作为学习笔记列出来,提醒自己注意! 如果大家有需要,欢迎访问前辈的博客https://www.liaoxuefeng.com/ ...

  8. JavaScript ES6 Arrow Functions(箭头函数)

    1. 介绍 第一眼看到ES6新增加的 arrow function 时,感觉非常像 lambda 表达式. 那么arrow function是干什么的呢?可以看作为匿名函数的简写方式. 如: var ...

  9. javascript基础修炼(8)——指向FP世界的箭头函数

    一. 箭头函数 箭头函数是ES6语法中加入的新特性,而它也是许多开发者对ES6仅有的了解,每当面试里被问到关于"ES6里添加了哪些新特性?"这种问题的时候,几乎总是会拿箭头函数来应 ...

随机推荐

  1. 【VS2012】F5不能自动编译新修改

    VS2012正常使用时,如果文件有修改,按F5运行时,会自动对修改的文件进行重新编译.今天遇到的情况却并没有.度娘了下,网上有相同的问题,解决办法是“工具->选项->项目和解决方案-> ...

  2. Java中的数据类型转换

    先来看一个题: Java类Demo中存在方法func0.func1.func2.func3和func4,请问该方法中,哪些是不合法的定义?( ) public class Demo{ float fu ...

  3. 学习ssm心得

    学习是一个探索的过程,在我编程能力提高的阶段中,我发现在编写代码之前,必须得弄清代码的逻辑,我到底要干什么,从哪一步做起.端与端之间该怎么衔接. 先把问题想清楚,再去编写.不要急着去乱敲一通,一点用处 ...

  4. 文本(TextView)

    今天给大家介绍一下简单的文本. 首先我们看下TextView的继承关系和一些基本的属性: xml文件如下: <?xml version="1.0" encoding=&quo ...

  5. Windows 10 Framework 3.5 _x64 离线安装包 最新安装版

    原文:http://www.jb51.net/softs/325481.html Windows 10 Framework 3.5 离线安装包,适用于 Win10 和 Server 2016 离线安装 ...

  6. 131.007 Unsupervised Learning - Feature Selection | 非监督学习 - 特征选择

    1 Why? Reason1 Knowledge Discovery (about human beings limitaitons) Reason2 Cause of Dimensionality ...

  7. mvn install 时候报GBK编码错误解决办法

    在pom.xml里面 <properties> <!-- 文件拷贝时的编码 --> <project.build.sourceEncoding>UTF-</p ...

  8. svn提示out of date的解决方法

    步骤1. team–>update 步骤2. team–>Show Tree Conflict–>标记"冲突已解决" 步骤3. team–>commit

  9. MYSQL LOGBIN 数据日志恢复数据库随笔

    查看指定的二进制日志中的事件(MYSQL命令行) mysql> show binlog events in 'binlogfullpath'; 查看二进制日志中的事件(MYSQL命令行) mys ...

  10. Visual Staudio 2015 打开指定文件,定位到指定文件目录下

    Visual Staudio 2015 项目定位文件位置 每次使用的Visual Staudio 2015 写代码的时候总是打开了.cs文件或xaml文件时, 还要手动去找该 文件位置,每次都要翻好大 ...