js中的this详解
在web前端开发中,javascript中的this和其他的JAVA,C#等大型语言一样,是一个重要概念。但是要注意的是,在javascript中,由于 javascript的动态性,this的指向在运行时才确定,这就需要我们掌握它的工作原理。
零度接下来来分析分析。
默认的this
Javascript 下,所有的属性都默认为window对象所有,所以说this也不例外,看下面的例子,先来个热身:
var a = “123”;
function fn(){
var a = “345”;
alert(this.a);//与window.a相同
}
fn();//
由此可见,fn()执行时,函数里的this 指向全部对象window。
指定事件的this
再看下面这个例子:
window.onload = function(){
document.getElementById(“box”).onclick = function(){
alert(this.style.width);
};
}
运行弹出的是id为box元素的宽,表明这里的this指向的是当前元素。
不指定事件元素的时候this指定的是window,指定事件元素的时候,this指定当前发生事件的元素。
js中的this详解的更多相关文章
- JS中this关键字详解
本文主要解释在JS里面this关键字的指向问题(在浏览器环境下). 阅读此文章,还需要心平气和的阅读完,相信一定会有所收获,我也会不定期的发布,分享一些文章,共同学习 首先,必须搞清楚在JS里面,函数 ...
- JS 中 this 关键字详解
本文主要解释在JS里面this关键字的指向问题(在浏览器环境下). 首先,必须搞清楚在JS里面,函数的几种调用方式: 普通函数调用 作为方法来调用 作为构造函数来调用 使用apply/call方法来调 ...
- Bom和Dom编程以及js中prototype的详解
一.Bom编程: 1.事件练习: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "h ...
- JavaScript面向对象(一)——JS OOP基础与JS 中This指向详解
前 言 JRedu 学过程序语言的都知道,我们的程序语言进化是从"面向机器".到"面向过程".再到"面向对象"一步步的发展而来.类似于 ...
- JS中navigator对象详解
<code class="language-html"><!doctype html> <html> <head> <meta ...
- js中Date()对象详解
var myDate = new Date(); myDate.getYear(); //获取当前年份(2位) myDate.getFullYear(); //获取完整的年份(4位,1970-???? ...
- js中的逻辑运算符详解(||、&&、!)
视频地址:https://www.bilibili.com/video/BV1Y7411K7zz?p=1 一直以来都没弄清楚js中的逻辑运算符是怎么回事 , 一直都以为他们的用法和java一样 , 今 ...
- js中window对象详解以及页面跳转
1.window.top.window.location = "index.asp"; 2.window.top.location.href="index.asp&quo ...
- node.js中express-session配置项详解
官方地址:https://www.npmjs.com/package/express-session 作用:用指定的参数创建一个session中间件,sesison数据不是保存在cookie中,仅仅s ...
- js中的三目运算符详解
判断 javascript中的三目运算符用作判断时,基本语法为: expression ? sentence1 : sentence2 当expression的值为真时执行sentence1,否则执行 ...
随机推荐
- spring boot整合mail
1.添加依赖 </dependency> <dependency> <groupId>org.springframework.boot</groupId> ...
- 继承—Monkey
public class Monkey { public void Monkey(String s){ } public void speak(){ System.out.println(" ...
- java 通过httpclient调用https 的webapi
java如何通过httpclient 调用采用https方式的webapi?如何验证证书.示例:https://devdata.osisoft.com/p...需要通过httpclient调用该接口, ...
- UI Framework-1: UI Development Practices
UI Development Practices Guidelines Principles for developing for Chrome. These best practices cente ...
- ubuntu18.04安装dash-to-dock出错的问题
之前在安装dash-to-dock出现了这种错误: TypeError: ExtensionUtils.initTranslations is not a function Stack trace:i ...
- 洛谷P1164 小A点菜 && caioj 1410 动态规划1:点菜(背包方案问题)
方程很简单 f[0] = 1 f[j] += f[j-w[i]] #include<cstdio> #define REP(i, a, b) for(int i = (a); i < ...
- HDU 2253 Longest Common Subsequence Again
其实这个题我还不会,学长给了一个代码交上去过了,据说用到了一种叫做位压缩的技术,先贴代码吧,以后看懂了再来写 #include <stdio.h> #include <string. ...
- HTML学习----------DAY2第四节
HTML 文档是由 HTML 元素定义的. HTML 元素 HTML 元素指的是从开始标签(start tag)到结束标签(end tag)的所有代码. 注释:开始标签常被称为开放标签(opening ...
- 第6章8节《MonkeyRunner源代码剖析》Monkey原理分析-事件源-事件源概览-小结
本章我们重点环绕处理网络过来的命令的MonkeySourceNetwork这个事件源来阐述学习Monkey是怎样处理MonkeyRunner过来的命令的.以下总结下MonkeyRunner从启动Mon ...
- C++学习笔记11-面向对象2
1. 仅仅能初始化直接基类 一个类仅仅能初始化自己的直接基类.直接就是在派生列表中指定的类.假设类C 从类B 派生,类B 从类A 派生,则B 是C 的直接基类.尽管每一个C 类对象包括一个A 类部 ...