未加星标

javascript之this

字体大小 | |
[前端(javascript) 所属分类 前端(javascript) | 发布者 店小二04 | 时间 2016 | 作者 红领巾 ] 0人收藏点击收藏

MDN关于this的描述

全局上下文

在全局运行上下文中(在任何函数体外部),this指代全局对象,无论是否在严格模式下

console.log(this.document === document);//true console.log(this === window); //true this.a = 22; console.log(window.a); //22 函数上下文

在函数内部,this的值取决于函数是如何调用的

直接调用 function f1() { return this; } f1() === window; //true function f2() { "use strict"; return this; } f2() === undefined; // true 在严格模式下,this是进入运行环境时设置的 对象方法中的this var o = { prop: 22, f: function() { return this.prop; } }; console.log(o.f());//22 原型链中的this var o = { f: function(){ return this.a + this.b; } }; var p = Object.create(o); p.a = 1; p.b = 4; console.log(p.f()); //5 call和apply

通过call()和applly(),可以将this绑定在一个指定的对象上

function add(c,d){ return this.a + this.b + c + d; } var o = {a:1, b:3}; add.call(o,5,7); add.apply(o,[5,7]); bind方法

调用f.bind(someObject)会创建一个与f具有相同函数体和作用域的函数,但是在这个新函数中,this将永久地被绑定到了bind的第一个参数,无论这个函数是如何被调用的。

function f(){ return this.a; } var g = f.bind({a:'azerty'}); console.log(g());//azerty var o = {a:37, f:f, g:g}; console.log(o.f(), o.g());//37 azerty DOM事件处理函数中的this

this指向触发事件的元素

// 被调用时,将关联的元素变成蓝色 function bluify(e){ console.log(this === e.currentTarget); // 总是 true // 当 currentTarget 和 target 是同一个对象是为 true console.log(this === e.target); this.style.backgroundColor = '#A5D9F3'; } // 获取文档中的所有元素的列表 var elements = document.getElementsByTagName('*'); // 将bluify作为元素的点击监听函数,当元素被点击时,就会变成蓝色 for(var i=0 ; i<elements.length ; i++){ elements[i].addEventListener('click', bluify, false); } 内联事件处理函数中的 this

当代码被内联处理函数调用时,它的this指向监听器所在的DOM元素:

<button onclick="alert(this.tagName.toLowerCase());"> Show this </button>

本文前端(javascript)相关术语:javascript是什么意思 javascript下载 javascript权威指南 javascript基础教程 javascript 正则表达式 javascript设计模式 javascript高级程序设计 精通javascript javascript教程

分页:12
转载请注明
本文标题:javascript之this
本站链接:http://www.codesec.net/view/480164.html
分享请点击:


1.凡CodeSecTeam转载的文章,均出自其它媒体或其他官网介绍,目的在于传递更多的信息,并不代表本站赞同其观点和其真实性负责;
2.转载的文章仅代表原创作者观点,与本站无关。其原创性以及文中陈述文字和内容未经本站证实,本站对该文以及其中全部或者部分内容、文字的真实性、完整性、及时性,不作出任何保证或承若;
3.如本站转载稿涉及版权等问题,请作者及时联系本站,我们会及时处理。
登录后可拥有收藏文章、关注作者等权限...
技术大类 技术大类 | 前端(javascript) | 评论(0) | 阅读(38)