【javascript的this指向】的更多相关文章

图解javascript中this指向

JavaScript 是一种脚本语言,支持函数式编程.闭包.基于原型的继承等高级功能.JavaScript一开始看起来感觉会很容易入门,但是随着使用的深入,你会发JavaScript其实很难掌握,有些基本概念让人匪夷所思.其中JavaScript 中的 this 关键字,就是一个比较容易混乱的概念,在不同的场景下,this会化身不同的对象.有一种观点认为,只有正确掌握了 JavaScript 中的 this 关键字,才算是迈入了 JavaScript 这门语言的门槛.在主流的面向对象的语言中(例…

javascript的this指向

JavaScript 是一种脚本语言,支持函数式编程.闭包.基于原型的继承等高级功能.JavaScript一开始看起来感觉会很容易入门,但是随着使用的深入,你会发现JavaScript其实很难掌握,有些基本概念让人匪夷所思.其中JavaScript 中的 this 关键字,就是一个比较容易混乱的概念,在不同的场景下,this会化身不同的对象.有一种观点认为,只有正确掌握了 JavaScript 中的 this 关键字,才算是迈入了 JavaScript 这门语言的门槛.在主流的面向对象的语言中(…

JavaScript对象的指向问题

JavaScript对象的指向问题 标签(空格分隔): JavaScript 对象 在接触了JavaScript之后,我们常听到一句话就是一切皆对象,意思是说除了object以外,JavaScript中的字符串,数字,true,false,undefined,null,NaN,hash等等都是对象. 对象是可变的,意思是说我们通过引用而不是一个值来操作对象,下面用一段代码来看这个问题: var x={a:1};//这里声明一个对象X,里面包含属性a,它的值为1 var y=x;//这里声明一个变…

JavaScript对象this指向(普通键this指向 非指向函数的键)

1.结论 JavaScript对象普通键(非指向函数的键)this指向是window. 2.示例 <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />…

图解javascript的this指向

图解javascript的this指向 作者: HerryLo 本文永久有效链接: https://github.com/AttemptWeb...... 以下就只有两张图,请放心食用!! #简版this指向 #升级版this指向 #解释: 这里的上下文对象如下: function fn() {console.log('this指向:', this);} let Obj = { fn: fn } window.fn(); // 上下文对象调用, 等价于直接调用 fn() Obj.fn(); //…

javascript this关键字指向详解

在之前写代码的经历中,常常试过写着写着this就莫名其妙的不知道指向到哪里去了.今天看了曾探的javascript设计模式,里面特别谈到了this在不同情况下指代的对象,非常有意思. this指代的情况 this有以下4种情况: 1.对象.函数的形式调用:object.function(); 2.普通函数的形式调用:function(); 3.构造器调用; 4.Function.prototype.call或Function.prototype.apply调用; 1.对象.函数的形式调用 对象.…

javascript this指针指向？

前言 理解javascript的指针就需要先了解js的执行环境和作用域!执行环境的定义了变量或函数有权访问的其他数据,决定了它们各自的行为.每个执行环境都有一个与之关联的变量对象,环境中定义的所有的变量和函数都保存在这个对象中.虽然我们编写的代码无法访问这个对象,但解析器在处理数据时会在后台使用它. 1.全局执行环境 全局执行环境是最外围的一个执行环境,根据js实现的宿主环境的不同,表示执行环境的对象也不一样.在web浏览器中认为window就是全局执行的对象.因此所有的全局变量和函数都是作为w…

javascript中this指向问题

本文参考http://www.ruanyifeng.com/blog/2010/04/using_this_keyword_in_javascript.html this是JavaScript的一个关键字,它代表函数运行时自动生成的一个内部对象,只能在函数内部使用,比如: function test () { this.x = 1; } 随着函数使用场合的不同,this的指向会发生变化.但有一个总的原则就是,this指向最后一个调用函数的那个对象. 下面分四种情况,讨论一下this的用法: 情况…

从零开始学习前端JAVASCRIPT — JavaScript中this指向的四种情况

JavaScript中this的四种情况(非严格模式) 1.当this所在函数是事件处理函数时,this指向事件源.2.当this所在函数是构造函数时,this指向new出来的对象.3.this所在函数的所属对象是谁,this指向函数所属对象.4.当this所在函数没有所属对象,this指向window对象 <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g…

JavaScript 的 this 指向问题深度解析

与我们常见的很多语言不同,JavaScript 函数中的 this 指向并不是在函数定义的时候确定的,而是在调用的时候确定的.换句话说,函数的调用方式决定了 this 指向. JavaScript 中,普通的函数调用方式有三种:直接调用.方法调用和 new 调用.除此之外,还有一些特殊的调用方式,比如通过 bind() 将函数绑定到对象之后再进行调用.通过 call().apply() 进行调用等.而 es6 引入了箭头函数之后,箭头函数调用时,其 this 指向又有所不同.下面就来分析这些情况…

关于javascript中this 指向的4种调用模式

this指向问题绝对可以排js 的top 5最难和最重点的问题,初学者常常搞不清楚this指向哪里,特别是学过java和c#的人,想当年俺也迷糊了好久,直到遇到蝴蝶书,主要是因为js和主流的面向对象语言java,c#都不同(相似的问题还有new 操作符的问题, 关于new 构构器函数的原理,参见这篇文章: http://www.cnblogs.com/windyfancy/p/5167266.html ),this并不指向当前对象,这是理解this的关键所在,this的指向取决于你是采用何种方式…

javascript中this指向的问题

javascript中this只有函数执行时候才能确定到底指向谁,实际this最终指向是那个调用它的对象. 1,匿名函数中的this——window function foo(){ var lastName = 'miya'; console.log(this.lastName); //undefined console.log(this); //window } foo(); 2,作为对象的方法的this //作为对象方法 var obj = { a:1, getA: function(){…

JavaScript 的 this 指向和绑定详解

JavaScript 中的 new.bind.call.apply 实际这些都离不开 this,因此本文将着重讨论 this,在此过程中分别讲解其他相关知识点. 注意: 本文属于基础篇,请大神绕路.如果你不够了解,或者了解的还不完整,那么可以通过本文来复习一下. this 指向的类型 刚开始学习 JavaScript 的时候,this 总是最能让人迷惑,下面我们一起看一下在 JavaScript 中应该如何确定 this 的指向. this 是在函数被调用时确定的,它的指向完全取决于函数调用的地…

JavaScript中this指向的简单理解

首先必须要说的是,this的指向在函数定义的时候是确定不了的,只有函数执行的时候才能确定this到底指向谁,实际上this的最终指向的是那个调用它的对象(这句话有些问题,后面会解释为什么会有问题,虽然网上大部分的文章都是这样说的,虽然在很多情况下那样去理解不会出什么问题,但是实际上那样理解是不准确的,所以在你理解this的时候会有种琢磨不透的感觉),那么接下来我会深入的探讨这个问题. 为什么要学习this?如果你学过函数式编程,面向对象编程,那你肯定知道干什么用的,如果你没有学过,那么暂时可以不…

javascript中this指向

在简单函数中,this是指向当前对象,可用来获取当前对象某个属性,但随着函数变复杂,this很多情况不指向当前对象,而是指向window. 1.在独立调用函数中,具有全局执行环境,this指向window. var name="evan"; function Name(){ this.name="evan2"; 4 console.log(this.name) //evan2 } Name(); console.log(this.name) //evan2 2. 匿…

十分钟彻底理解javascript 的 this指向，不懂请砸店

函数的this指向谁,和函数在哪里被定义的,函数在哪里被执行的没有半毛钱关系,只遵守下面的规律: 在非严格模式中: 1.自执行函数里面,this永远指向window; <script> var a = 1; var o = { a: 2, fn: (function(){ //自执行函数,在定义的时候就已经执行啦 console.log('自执行函数里面是window',this.a); //自执行函数里面的this指向的是window return function() { // 但是这里的…

深入理解JavaScript的this指向问题

Javascript的this用法 this是Javascript语言的一个关键字.它代表函数运行时,自动生成的一个内部对象,只能在函数内部使用.比如: function test(){ this.x = 1; } 随着函数使用场合的不同,this的值会发生变化.但是有一个总的原则,那就是this指的是调用函数的那个对象. 下面分四种情况,详细讨论this的用法. 情况一:纯粹的函数调用 这是函数的最通常用法,属于全局性调用,因此this就代表全局对象Global.请看下面这段代码,它的运行结果…

javascript：this指向

this常见指向问题 this的用法 1.直接在函数中使用 谁调用这个函数this就指向谁 2.对象中使用, 一般情况下指向该对象 3.在构造函数中使用 改变this的指向,两种方法的作用都是相同的,传递的写法不同而已. call -- (指向谁,参数1,参数2......) apply -- (指向谁,[参数1,参数2]) 数组的形式 1. this与普通函数执行 当一个函数执行不带任何修饰时,使用默认绑定规则. 默认绑定:函数体如果在非严格模式下,this绑定到window,严格模式下绑定到…

浅谈javascript的this指向

This的指向大致能够分为下面四类.我们分别举例说明 1. 作为对象的方法调用时.this指向该对象 var obj={     a:1,     getA:function(){        console.log( this==obj); //输出true        console.log(this.a);    //输出1     } } obj.getA(); 2. 作为普通函数调用时,this总是指向全局对象,比方说在浏览器中,这个全局对象是window. window.name…

javascript之this指向

情况一: 如果一个函数中有this,但是没有被上一级调用,this指向window 例: function a(){ var num='11'; console.log(this.num);  //undefined console.log(this)           //window } a() 情况二: 如果一个函数有this,该函数被上一级调用,this指向上一级函数 例: var o={ a:'11', b:function(){ console.log(this.a);     /…

JavaScript this 的指向问题

原文作者:SegmentFault ——写bug 原文链接:https://segmentfault.com/a/1190000015438195 this的指向已经是一个老生常谈的问题,每逢面试都要去复习复习,近来巩固js的基础,决心彻底掌握这个知识点,一劳永逸.说明一下,为了不影响大家的思考过程,下面的代码都不会去注释答案,想知道答案,只需要去控制台执行一下. 四类场景逐一击破 首先,分析this的指向共有四种类型,在分析之前,我们首先带好两个锦囊:1.函数被调用时(即运行时)才会确定该函数…

javascript中constructor指向问题

首先用一个例子指出来constructor存在形式. function Fruit(){ } var f=new Fruit(); console.log(f.constructor);//打印出Fruit() 由上面的代码我们总结出结论1:上面的代码在控制台可以看出constructor是指向构造器Fruit的引用. function Fruit(){ this.name="水果"} //var f=new Fruit(); function Apple(){this.name=&q…

图解javascript this指向什么？

JavaScript 是一种脚本语言,支持函数式编程.闭包.基于原型的继承等高级功能.JavaScript一开始看起来感觉会很容易入门,但是随着使用的深入,你会发现JavaScript其实很难掌握,有些基本概念让人匪夷所思.其中JavaScript 中的 this 关键字,就是一个比较容易混乱的概念,在不同的场景下,this会化身不同的对象.有一种观点认为,只有正确掌握了 JavaScript 中的 this 关键字,才算是迈入了 JavaScript 这门语言的门槛.在主流的面向对象的语言中(…

JavaScript中的this指向规则

首先,JavaScript的this指向问题并非传说中的那么难,不难的是机制并不复杂,而被认为不好理解的是逻辑关系和容易混淆的执行上下文.这篇博客也就会基于这两个不好理解的角度来展开,如要要严格的来对this的指向来分类的话,有三类不同的情况,一种是独立函数执行的指向机制,第二种就是引用指向机制,第三种是new机制下的this指向.然后建立在这三个指向机制的基础上来剖析一些this的常见问题,下面进入正文解析this指向机制: 一.独立函数执行的指向机制 在JavaScript中函数执行可以分为…

Javascript中的this指向。

一.JavaScript中的函数 在了解this指向之前,要先弄明白函数执行时它的执行环境是如何创建的,这样可以更清楚的去理解JavaScript中的this指向. function fn(x,y,name){ var str1=x; var str2=y; this.name=name; function(){ alert(str1,str2); } }fn(1,1,Admin); 当调用fn(1,1,Admin)时,首先函数会创建一个活动对象,也叫做变量对象,接着为函数调用创建一个类似数组的…

一分钟搞懂 JavaScript this 指向问题

关于Javascript的this指向问题,网络上有很多分析文章,写的很好,比如这里和这里 我这里做一个简单的总结. 箭头函数的 this 箭头函数内的this指向外层函数定义时所在的作用域.如果没有外层函数,则指向全局作用域. ES5 的 this ES5的this指向当前函数执行时所在的上下文. 注意:调用普通函数,它的this指向全局作用域. 什么是普通函数? // 这就是 funtion a() {console.log(this)}…

javascript this 代表的上下文,JavaScript 函数的四种调用形式

JavaScript 是一种脚本语言,支持函数式编程.闭包.基于原型的继承等高级功能.其中JavaScript 中的 this 关键字,就是一个比较容易混乱的概念,在不同的场景下,this会化身不同的对象.有一种观点认为,只有正确掌握了 JavaScript 中的 this 关键字,才算是迈入了 JavaScript 这门语言的门槛.在主流的面向对象的语言中(例如Java,C#等),this 含义是明确且具体的,即指向当前对象.一般在编译期绑定.而 JavaScript 中this 在运行期进行…

javascript this（上）

javascript的this指向的是一个函数运行时动态绑定对象. this的4种常见的指向: 作为对象的方法调用 var obj={ name:"姚小白", getName:function(){ console.log(this === obj); console.log(this.name) } } obj.getName(); //true //姚小白 函数被作为一个对象调用,所以this的指向了obj对象. 作为普通函数调用 在普通函数中,this指向的全局对象,也就是win…

理解 JavaScript call()/apply()/bind()

理解 JavaScript this 文章中已经比较全面的分析了 this 在 JavaScript 中的指向问题,用一句话来总结就是:this 的指向一定是在执行时决定的,指向被调用函数的对象.当然,上篇文章也指出可以通过 call() / apply() / bind() 这些内置的函数方法来指定 this 的指向,以达到开发者的预期,而这篇文章将进一步来讨论这个问题. 先来回顾一下,举个简单的例子: var leo = { name: 'Leo', sayHi: function() {…

图解avaScript中this指向(超透彻)

一个图讲清楚JavaScript中this指向: 说明: (1)严格模式下,禁止this关键字指向全局对象会报错. (2)闭包中的this对象具有全局性,因此通常指向window.  (3)优先级:new>apply/call>.调用>默认调用 (4)null/undefined,在使用apply或者call时传入null/undefined时,会使用默认调用. <!DOCTYPE html> <html lang="zh"> <head…