闭包、this、ES6特性
声明一个函数 function fun1
函数内定义一个变量比如 var x=1
如果这时候在function内声明一个函数 fun2
fun2中对这个函数外面的x进行操作
这时候把fun2的地址付给函数外面的一个变量A
形成一个函数表达式,
因为JS中的作用域是从内层向外层找变量的值
每次运行A 即A()的时候都需要找之前那个x 这时候函数fun1就叫作一个闭包(closure) ,这个x会一直留在内存中不会被回收 即 —(closure:fun1)
fun2 fun1 全局 ---> 作用域链
| (包起来了) |
| |
----------------------------
|
|
形成了一个闭包
因为全局和fun2的作用域连结起来了
讲一下this:
1.this是在一个函数被调用时确定的。(注意函数这两个大字)
2.函数被调用的时候 如果函数被某一个对象所拥有, 那么this指向这个对象。
3.如果函数独立调用,this指向undefined,在非严格模式下指向window
4.当this为某个(属性:值)键值对中的值的内容时,先找那个函数,再找那个函数的对象,要是没有函数就是window
关于第四点:
var obj = { a:this };
console.log(obj.a); <-没有函数,最后找到window
// demo
var a = 20;
var obj = {
a: 10,
c: this.a + 20, <--这里的this是window
fn: function () {
return this.a; <--函数fn属于obj对象,这里的this是obj
}
}
console.log(obj.c);
console.log(obj.fn());
// demo2
'use strict';
var a = 20;
function foo () {
var a = 1;
var obj = {
a: 10,
c: this.a + 20, <--这里this,先看他在 函数 foo里面,然后foo并不属于任何对象 所以是undefined
fn: function () {
return this.a;
}
}
return obj.c;
}
console.log(foo()); // ?
console.log(window.foo()); // ? <-- window对象中的foo
写一个粘合函数:
function glue(){
var a = Array.prototype.slice.call(arguments); //call中的this指向了arguments
console.log(a.join(''));
}
glue('把',123,'我','粘合','起来吧');
讲一下箭头函数:
function a(){
var x = 20;
return function(){
this.x;
}
}
a();
这样return的是10。(this是在函数被调用时确定的,return的这个function不属于任何对象,所以这个function中的this是undefined,在非严格下是window)
如果是用 return ()=> this.x this是他外面的this
原因:箭头函数中没有this,如果在箭头函数中使用this,则这个this一定是他外层的this 即爸爸function的this!!
闭包、this、ES6特性的更多相关文章
- 最常用的ES6特性(转)
最常用的ES6特性 let, const, class, extends, super, arrow functions, template string, destructuring, defaul ...
- 最常用的ES6特性
遇到了要写出es6新特性的题目,所以查阅了资料来总结一下,点击查看原文. 进入正题,最常用的ES6特性有:let, const, class, extends, super, arrow functi ...
- ES6特性
一.ES6特性: let, const, class, extends, super, arrow functions, template string, destructuring, default ...
- 第四节:教你如何快速让浏览器兼容ES6特性
写在正文前,本来这一节的内容应该放在第二节更合适,因为当时就有同学问ES6的兼容性如何,如何在浏览器兼容ES6的特性,这节前端君会介绍一个抱砖引玉的操作案例. 为什么ES6会有兼容性问题? 由于广大用 ...
- 解决浏览器兼容ES6特性
为什么ES6会有兼容性问题? 由于广大用户使用的浏览器版本在发布的时候也许早于ES6的定稿和发布,而到了今天,我们在编程中如果使用了ES6的新特性,浏览器若没有更新版本,或者新版本中没有对ES6的特性 ...
- 现在就可以使用的5个 ES6 特性
小编推荐:掘金是一个高质量的技术社区,从 ECMAScript 6 到 Vue.js,性能优化到开源类库,让你不错过前端开发的每一个技术干货.各大应用市场搜索「掘金」即可下载APP,技术干货尽在掌握. ...
- 解决让浏览器兼容ES6特性
为什么ES6会有兼容性问题? 由于广大用户使用的浏览器版本在发布的时候也许早于ES6的定稿和发布,而到了今天,我们在编程中如果使用了ES6的新特性,浏览器若没有更新版本,或者新版本中没有对ES6的特性 ...
- js数组操作find查找特定值结合es6特性
js数组操作find查找特定值结合es6特性
- 9个常用ES6特性归纳(一般用这些就够了)
ECMAScript 6.0(以下简称 ES6)是 JavaScript 语言的下一代标准,已经在 2015 年 6 月正式发布了.它的目标,是使得 JavaScript 语言可以用来编写复杂的大型应 ...
随机推荐
- Java IO 流总结
Java流操作有关的类或接口: Java流类图结构: 流的概念和作用 流是一组有顺序的,有起点和终点的字节集合,是对数据传输的总称或抽象.即数据在两设备间的传输称为流,流的本质是数据传输,根据数据传输 ...
- vue项目优化--使用CDN和Gzip
使用vue-cli构建的vue项目,在打包发布的时候,发现打包后的文件体积很大,使用webpack-bundle-analyzer分析后,发现占用空间最多的是引用的第三方依赖.第三方的依赖文件可以使用 ...
- c++之vector使用
Vector是向量模板,C++ STL之一(本质上是一个动态数组).vector是一个动态生长的数组,一开始vector为空时,会给一个初始化的容量 (就是允许的添加个数并申请好内存),当往添加的元素 ...
- some untracked working tree files问题解决
我使用的是idea,情境是在使用git同步代码的时候,出现的错误. 我这里报错是在右上角的显示信息,其中有一个show view的可点击连接 我点击之后将上面展示的文件删除之后重新同步代码,成功.
- 00073_Math类
1.Math类概述 (1)Math 类是包含用于执行基本数学运算的方法的数学工具类,如初等指数.对数.平方根和三角函数: (2)类似这样的工具类 ,其所有方法均为静态方法,并且一般不会创建对象.如Sy ...
- nyoj 42判断欧拉路径模板题
#include<stdio.h> #include<string.h> #define N 2100 int degree[N]; int pre[N];//很长时间没写欧拉 ...
- (OpenExplorer For Eclipse)Eclipse 中打开工程目录的插件(转)
我们想在Eclipse中的打开工程目录,Eclipse 自身没有这个功能,我们可以安装一个插件来实现这个功能.具体的操作方法如下: (1).到以下链接中下载插件:https://github.com/ ...
- POJ 2191
只会打表 #include <iostream> #include <cstdio> #include <cstdlib> #include <cstring ...
- multiset多重集合容器
跟set集合容器相比,multiset多重集合容器也使用红黑树组织元素,仅仅是multiset多重集合容器同意将反复的元素键值插入.元素的搜索依旧具有对数级的算法时间复杂度,find和equal_ra ...
- OzymanDNS 使用——perl 5.22没有成功。。。
最初官方的代码没有找到,但是发现github里貌似有: git clone https://github.com/splitbrain/dnstunnel.git 源码是perl写的,需要安装一些pe ...