javascript中几种this指向问题
javascript中几种this指向问题
首先必须要说的是,this 永远指向函数运行时所在的对象,而不是函数被创建时所在的对象。
(1)、作为函数名调用
函数作为全局对象调用,this指向全局对象
function a(){
var author = "lry";
console.log(this.author); //undefined
console.log(this); //Window
}
a(); //其实这是相当于 window.a()
(2)、作为方法调用
函数作为对象中的一个属性,成为该对象的一个方法,this指向该对象
var o = {
author:"lry",
fn:function(){
console.log(this.author); //lry
}
}
o.fn(); //this => o
(3)、使用构造函数调用
使用new调用的函数,则其中this将会被绑定到那个新构造的对象。(首先new关键字会创建一个空的对象,然后会自动调用一个函数方法(apply...),将this指向这个空对象,这样的话函数内部的this就会被这个空的对象替代)
function Fn() {
this.author = "lry"
}
var o = new Fn();
console.log(o.author); //lry
(4)、apply或call调用
自行改变this指向,函数this指向apply或call方法调用时的第一个参数
var o = {
author:"lry",
fn:function(){
console.log(this.author); //lry
}
}
var b = o.fn;
b.call(o); //或者 b.apply(o)
补充:
this的最终指向的是那个调用它的对象(大多数可以这么理解,但并不是准确的)
var o = {
a:10,
b:{
a:20,
fn:function(){
console.log(this.a); //20
}
}
}
o.b.fn();
这里的this为什么不是指向o?如果按照上面的理论,最终this指向的是调用它的对象,因为 如果一个函数中包含多个对象,尽管这个函数是被最外层的对象所调用,this指向的也只是它上一级的对象。看下面例子:虽然对象b中没有属性a,但this仍然指向的是它的上一级对象b
var o = {
a:10,
b:{
//a:20,
fn:function(){
console.log(this.a); //undefined
}
}
}
o.b.fn();
特殊情况:
var o = {
a:10,
b:{
a:20,
fn:function(){
console.log(this.a); //undefined
console.log(this); //window
}
}
}
var c = o.b.fn;
c();
这是的this指向的是window...为什么呢?如果你还没缓过神来的话,那你可能没有理解this指向的永远是最后调用它的对象。
如有错误,欢迎指正~~~
javascript中几种this指向问题的更多相关文章
- [js]javascript中4种异步
javascript中4种异步: 1.ajax 2.定时器 3.事件绑定 4,回调 定时器 //顺序执行 /* var s = 0; for (var i = 0; i < 10000; i++ ...
- JavaScript中两种类型的全局对象/函数【转】
Snandy Stop, thinking is the essence of progress. JavaScript中两种类型的全局对象/函数 这里所说的JavaScript指浏览器环境中的包括宿 ...
- JavaScript中四种不同的属性检测方式比较
JavaScript中四种不同的属性检测方式比较 1. 用in方法 var o = {x:1}; "x" in o; //true "y" in o; //fa ...
- JavaScript 中 4 种常见的内存泄露陷阱
了解 JavaScript 的内存泄露和解决方式! 在这篇文章中我们将要探索客户端 JavaScript 代码中常见的一些内存泄漏的情况,并且学习如何使用 Chrome 的开发工具来发现他们.读一读吧 ...
- javascript中五种基本数据类型
前言: JavaScript中有五种基本数据类型(也叫做简单数据类型)分别为:undefined.null.bolean.number.string:另外还含有一种复杂的数据类型:object. 深入 ...
- javascript中6种基本数据类型详解
javascript中有5中数据类型(也称为基本数据类型):Undefined.Null.Boolean.Number和String,还有一种复杂数据类型——object,object本质是由一组键值 ...
- JavaScript中七种数据类型·中·一
Standing on Shoulders of Giants; 说到JavaScript里的类型很容易就让人想起 42和"42",分别是string型和number型,但是他们可 ...
- Javascript中两种最通用的定义类的方法
在Javascript中,一切都是对象,包括函数.在Javascript中并没有真正的类,不能像C#,PHP等语言中用 class xxx来定义.但Javascript中提供了一种折中的方案:把对象定 ...
- JavaScript中的this对象指向理解
在JavaScript中,this不是固定不变的,它的指向取决于上下文环境,一般的,认为this指向使用它时所在的对象.主要有以下几类指向: 在方法中,this 表示该方法所属的对象. 如果单独使用, ...
随机推荐
- ref关键字的用法
ref 关键字通过引用(而非值)传递参数. 通过引用传递的效果是,对所调用方法中的参数进行的任何更改都反映在调用方法中. 例如,如果调用方传递本地变量表达式或数组元素访问表达式,所调用方法会将对象替换 ...
- html学习笔记:基本结构,排列清单,表格
<html> <head> 基本结构,排列清单,表格 <title></title> <!--文件标题声明--> <base> ...
- Android SharedPreferences存储map的方法
在网上查了一些资料后,精简改写后得出自己想用的形式,记录一下 public static void putHashMapData(Context context, String key, Map< ...
- 【Mood 20】DailyBuild 4月
Notification使用详解之三:通过服务更新进度通知&在Activity中监听服务进度 基础总结篇之四:Service完全解析 Notification使用详解之二:可更新进度的通知 A ...
- PrintDocument打印、预览、打印机设置和打印属性的方法(较完整) .
private void Form1_Load(object sender, System.EventArgs e) { //获取或设置一个值,该值指示是否发送到文件或端口 printDocument ...
- 使用 SQL SERVER PROFILER 监测死锁
作为DBA,可能经常会遇到有同事或者客户反映经常发生死锁,影响了系统的使用.此时,你需要尽快侦测和处理这类问题. 死锁是当两个或者以上的事务互相阻塞引起的.在这种情况下两个事务会无限期地等待对方释放资 ...
- SQL Server现有表上自增属性增删原理研究
项目需求:线上有一张表,数据类型为int类型,现在由于项目变更,需要这一列添加自增属性,而且,为了保证能尽快完成,希望使用脚本来实现,而不是在表设计中通过GUI窗口来实现. 问题来了:SQL Serv ...
- laravel5.4学习笔记
1.安装laravel可以直接用composer安装,然后用laravel new xxx来新建项目 服务器上安装了composer(php包管理工具)以后, composer global requ ...
- Struts2学习-拦截器2
1.做一个登陆页面(loginView.jsp,才用Action来访问),2.登陆成功后,可以跳转到系统的首页(index.jsp),3.首页有一个链接(testOtherAction访问其它的功能模 ...
- 批量生成DDL脚本
获取用户下所有索引脚本,用于数据迁移后重建索引: set pagesize 0set long 90000set feedback offset echo offspool get_index_ddl ...