文章首发:http://www.cnblogs.com/sprying/p/3573456.html

使用this的几种场合

1. 执行函数时,判断函数是对象方法还是一个单独的函数?单独的函数this===window;
对象方法,this == 对象。

function UseThis(){
console.log(this === window);
this.instancePro = 1;
}
UseThis.objPro = 2;
UseThis.objMethod = function(){
console.log(this.objPro);
}
UseThis();//true 不管嵌套多深,执行函数时,函数内的this === window
console.log(instancePro);// var useThis = new UseThis();//false 当前是A是个构造函数,构造函数内的this,是new创建的实例
console.log(useThis.instancePro);// UseThis.objMethod();//2 当前函数是对象方法,this===UseThis
var fn = UseThis.objMethod;
fn();//undefined

打开测试页面,启动调试器

2. 函数由bind方法返回后,this指向bind的第一个参数。

3. 通过call(apply)执行函数,this指向call(apply)的第一个参数。

/*函数两次调用call*/
function doubleBind() {
  console.log(this.doubleVariable);
}
(function () {
  console.log(this.doubleCalendar);//
  doubleBind.call({doubleVariable: 1});//
}).call({doubleVariable: 2});

4. 一个函数,先调用bind,再使用call执行时,this指向bind的第一个参数。

/*由函数Bind绑定返回函数再调用call*/
function funBind() {
console.log(this.pro);
}
var relFun = funBind.bind({pro: 2});
relFun.call({pro: 3});//

出道题

var con_inObj = {
variable :"sprying",
cons_fun:function(){
console.log(this.variable);
}
}
var new_obj = new con_inObj.cons_fun();//? <!-- from 前端乱炖 -->
var x = 5;
var example = {
x: 100,
a: function () {
var x = 200;
console.log('a context: %s, var x = %s', this.x, x);
},
b: function () {
var x = 300;
return function () {
var x = 400;
console.log('b context: %s, var x = %s', this.x, x);
};
},
c: function () {
var other = {
x: 500
};
var execB = this.b().bind(other);
execB();
return execB;
}
}
console.log('example.x:' + example.x);
example.a();
example.b()();
example.a.call({
x: 9999
}); var execB = example.c();
execB.call({
x: 9999
});

想知道结果的同学,点击链接,打开调试器

诠释JavaScript中的this的更多相关文章

  1. javascript中的Array对象 —— 数组的合并、转换、迭代、排序、堆栈

    Array 是javascript中经常用到的数据类型.javascript 的数组其他语言中数组的最大的区别是其每个数组项都可以保存任何类型的数据.本文主要讨论javascript中数组的声明.转换 ...

  2. javascript中的this与函数讲解

    前言 javascript中没有块级作用域(es6以前),javascript中作用域分为函数作用域和全局作用域.并且,大家可以认为全局作用域其实就是Window函数的函数作用域,我们编写的js代码, ...

  3. JavaScript 中的数据类型

    Javascript中的数据类型有以下几种情况: 基本类型:string,number,boolean 特殊类型:undefined,null 引用类型:Object,Function,Date,Ar ...

  4. javascript中的操作符详解1

    好久没有写点什么了,根据博主的技术,仍然写一点javascript新手入门文章,接下来我们一起来探讨javascript的操作符. 一.前言 javascript中有许多操作符,但是许多初学者并不理解 ...

  5. 掌握javascript中的最基础数据结构-----数组

    这是一篇<数据结构与算法javascript描述>的读书笔记.主要梳理了关于数组的知识.部分内容及源码来自原作. 书中第一章介绍了如何配置javascript运行环境:javascript ...

  6. javascript中变量提升的理解

    网上找了两个经典的例子 var foo = 1; function bar() { if (!foo) { var foo = 10; } alert(foo); } bar(); // 10 var ...

  7. 前端开发:面向对象与javascript中的面向对象实现(二)构造函数与原型

    前端开发:面向对象与javascript中的面向对象实现(二)构造函数与原型 前言(题外话): 有人说拖延症是一个绝症,哎呀治不好了.先不说这是一个每个人都多多少少会有的,也不管它究竟对生活有多么大的 ...

  8. 简单分析JavaScript中的面向对象

    初学JavaScript的时候有人会认为JavaScript不是一门面向对象的语言,因为JS是没有类的概念的,但是这并不代表JavaScript没有对象的存在,而且JavaScript也提供了其它的方 ...

  9. Javascript中的valueOf与toString

    基本上,javascript中所有数据类型都拥有valueOf和toString这两个方法,null除外.它们俩解决javascript值运算与显示的问题,本文将详细介绍,有需要的朋友可以参考下. t ...

随机推荐

  1. 类与类之间的两种关系------新标准c++程序设计

    在c++中,类和类之间有两种基本关系:复合关系和继承关系. 复合关系也称为“has a”关系或“有”的关系,表现为封闭类,即一个类以另一个类的对象作为成员变量. 继承关系也称为“is a”关系或“是” ...

  2. 【leetcode 144. 二叉树的前序遍历】解题报告

    前往二叉树的:前序,中序,后序 遍历算法 方法一:递归 vector<int> res; vector<int> preorderTraversal(TreeNode* roo ...

  3. Apple导出p12证书 导出证书为p12 Apple开发

    1.原因说明 p12证书包含了我们的cer证书和私钥 这个证书可以当做我们开发凭证的备份 在我们更换开发机器的时候不需要再去Apple开发中心申请了 2.导出过程 2.1 打开钥匙串访问 2.2 选择 ...

  4. Mybatis中的多表查询 多对多

    示例:用户和角色 一个用户可以有多个角色 一个角色可以赋予多个用户 步骤: 1.建立两张表:用户表,角色表 让用户表和角色表具有多对多的关系. 需要使用中间表,中间表中包含各自的主键,在中间表中是外键 ...

  5. kali linux之选择和修改exp与windows后渗透

    网上公开的exp代码,选择可信赖的exp源,exploit-db,securityfocus,searchsploit,有能力修改exp(python,perl,ruby,c,c++.......) ...

  6. 渗透测试工具实战技巧 (转载freebuf)

    最好的 NMAP 扫描策略 # 适用所有大小网络最好的 nmap 扫描策略 # 主机发现,生成存活主机列表 $ nmap -sn -T4 -oG Discovery.gnmap 192.168.56. ...

  7. 【python】collections模块(有序字典,计数器,双向队列)

    collections模块基本介绍 我们都知道,Python拥有一些内置的数据类型,比如str, int, list, tuple, dict等, collections模块在这些内置数据类型的基础上 ...

  8. HDU - 5997 树状数组+set

    和之前一道省选题目很像: (梦幻布丁): 我们维护的时候用树状数组维护,在断电处打上标记: 合并的时候小的合并到大的里面: #include<iostream> #include<c ...

  9. rabbitmq消息消费者

    pom <?xml version="1.0" encoding="UTF-8"?> <project xmlns="http:// ...

  10. linux下的小命令

    (1) 查看服务器的IP信息 ip add show ifconfig (2) 操作网卡命令(重启网络和启用网卡) cleasystemctl restart network systemctl st ...