js中浅谈this对象(未补充完整)
什么是this?
1.javascript语言中,一切皆为对象(除了 undefined 和 null 之外),运行环境也是对象,所以函数都是在某个对象之中运行,this就是这个对象(环境)。
2.this的指向是动态的。如果函数在全局作用域中,那么this就会指向全局环境;如果函数位于某个对象中,那么this就会指向该对象。
3.与new关键字相同,this关键字总是返回一个对象
首先,必须搞清楚在JS里面,函数的几种调用方式:
普通函数调用
作为方法来调用
作为构造函数来调用
使用apply/call方法来调用
Function.prototype.bind方法
es6箭头函数
但是不管函数是按哪种方法来调用的,请记住一点:谁调用这个函数或方法,this关键字就指向谁。
this的使用场合
1.全局环境(全局作用域)
在全局作用域中使用this对象,它指向的就是顶层对象,也就是window对象。
function person(){
this.name="xl";
console.log(this);
console.log(this.name);
}
person(); //输出 window xl // 在这段代码中person函数作为普通函数调用,实际上person是作为全局对象window的一个方法来进行调用的,即window.person();
//所以这个地方是window对象调用了person方法,那么person函数当中的this即指window,同时window还拥有了另外一个属性name,值为xl. var name="xl";
function person(){
console.log(this.name);
}
person(); //输出 xl //同样这个地方person作为window的方法来调用,在代码的一开始定义了一个全局变量name,值为xl,它相当于window的一个属性,即window.name="xl",
又因为在调用person的时候this是指向window的,因此这里会输出xl. //在上面的代码中,普通函数的调用即是作为window对象的方法进行调用。显然this关键字指向了window对象.
上面代码中,不管是不是在函数内部,只要在全局作用域下运行,this就是指向顶层对象window。
2. 作为方法来调用:
当函数被保存为一个对象的属性时,它就可称为这个对象的方法。当一个方法被调用 时,this被绑定到这个对象上。
如果调用表达式包含一个提取属性的动作(. 或 []),那么它被称为方法调用;
var name="XL";
var person={
name:"xl",
showName:function(){
console.log(this.name);
}
}
person.showName(); //输出 xl
// //这里是person对象调用showName方法,很显然this关键字是指向person对象的,所以会输出name var showNameA=person.showName;
showNameA(); //输出 XL
//这里将person.showName方法赋给showNameA变量,此时showNameA变量相当于window对象的一个属性,因此showNameA()执行的时候相当于window.showNameA(),即window对象调用showNameA这个方法,所以this关键字指向window
//================================================================ var personA={
name:"xl",
showName:function(){
console.log(this.name);
}
}
personA.showName(); //输出xl;这里是personA中调用showName,所以this指向parsonA var personB={
name:"XL",
sayName:personA.showName
} personB.sayName(); //输出 XL
//虽然showName方法是在personA这个对象中定义,但是调用的时候却是在personB这个对象中调用,因此this对象指向personB;
3. 随时补充,暂时不会!
js中浅谈this对象(未补充完整)的更多相关文章
- JS中的内置对象简介与简单的属性方法
JS中的数组: 1.数组的概念: 数组是在内存中连续存储的多个有序元素的结构,元素的顺序称为下标,通过下标查找对应元素 2.数组的声明: ①通过字面量声明var arr1 = [,,,,] JS中同一 ...
- JavaScript -- 时光流逝(六):js中的正则表达式 -- RegExp 对象
JavaScript -- 知识点回顾篇(六):js中的正则表达式 -- RegExp 对象 1. js正则表达式匹配字符之含义 查找以八进制数 规定的字符. 查找以十六进制数 规定 ...
- js原型浅谈理解
之前在学习原型(prototype)的时候,一直对原型的理解不是很清晰,只是知道每个对象都有一个原型,然后在js中万物又皆对象.在这里谈一下自己对于js原型的简单理解吧. 原型可以实现属性和方法的共享 ...
- js中内置有对象
statpot:使用mongo+bootstrap+highcharts做统计报表 最近做了一个统计项目,这个统计项目大致的需求是统计接口的访问速度.客户端会调用一个接口来记录接口的访问情况,我的需求 ...
- JS中遍历数组、对象的方式
1.标准的for循环遍历数组 //不打印自定义属性和继承属性 var array = [1,2,3]; for (var i = 0; i < array.length; i++) { cons ...
- JS核心系列:浅谈原型对象和原型链
在Javascript中,万物皆对象,但对象也有区别,大致可以分为两类,即:普通对象(Object)和函数对象(Function). 一般而言,通过new Function产生的对象是函数对象,其他对 ...
- Js之浅谈dom操作
JavaScript之浅谈dom操作 1.理解dom: DOM(Document Object Model ,文档对象模型)一种独立于语言,用于操作xml,html文档的应用编程接口. 怎么说,我从两 ...
- 你真的懂Flask中浅谈蓝图Blueprint吗?
一,什么是Flask中的蓝图Blueprint Blueprint是用于实现Flask框架中单个应用的视图,模板,静态文件的集合. Blueprint 是一个存储操作(路由映射)方法的容器,这些操作在 ...
- IOS中 浅谈iOS中MVVM的架构设计与团队协作
今天写这篇文章是想达到抛砖引玉的作用,想与大家交流一下思想,相互学习,博文中有不足之处还望大家批评指正.本篇文章的内容沿袭以往博客的风格,也是以干货为主,偶尔扯扯咸蛋(哈哈~不好好工作又开始发表博客啦 ...
随机推荐
- 二叉树BinTree类定义
#include<iostream> using namespace std; template<class T> struct BinTreeNode{//二叉树结点类 T ...
- stl应用(map)或字典树(有点东西)
M - Violet Snow Gym - 101350M Every year, an elephant qualifies to the Arab Collegiate Programming C ...
- java、javaw和javaws的区别
java.javaw和javaws的区别: 首先,所有的这些都是java的启动装置,java.exe经常使用,当使用命令行输出到window的时候,会有java.exe进程,通过任务管理器可以看到.通 ...
- Windows程序设计--(五)绘图基础
5.1 GDI的结构 图形设备接口(GDI:Graphics Device Interface)是Windows的子系统,它负责在视讯显示器和打印机上显示图形. 5.2 设备环境 5.2.1 获取设备 ...
- presentingViewController、presentedViewController区别
解释两个属性:presentingViewController 和 presentedViewController A----(present)-----B----(present)-----C 1. ...
- JavaScript的三大组成部分
JavaScript是一种属于网络的脚本语言,已经被广泛用于Web应用开发,常用来为网页添加各式各样的动态功能,为用户提供更流畅美观的浏览效果.通常JavaScript脚本是通过嵌入在HTML中来实现 ...
- webRTC脱坑笔记(四)— windows下Nginx对Node服务的反向代理
Nginx反向代理 1.什么是反向代理 当我们有一个服务器集群,并且服务器集群中的每台服务器的内容一样的时候,同样我们要直接从个人电脑访问到服务器集群服务器的时候无法访问,必须通过第三方服务器才能访问 ...
- python 时间和时间段显示
两个包,最开始发现的是time包 import time print(time.time()) #显示当前时间戳 print(time.localtime(time.time())) #显示本地时间 ...
- https 配置
参考:https://www.cnblogs.com/tanghuachun/p/9951849.html 1.将pfx文件拷贝到application.properties同级目录下 2.添加配置文 ...
- Echarts和Highcharts学习笔记01——入门了解
Echarts是国内百度团队开发的(开源),基于Canvas,适合数据量较大的情况: Highcharts是国外的(商用需授权),基于SVG,方便自己定制,但能使用的图表类型有限: Echarts ...