JavaScirpt(JS)的this细究
一、js中function的不同形态
js中类和函数都要通过function关键字来构建。
1、js中当函数名大写时,一般是当作类来处理
function Foo(name, age) {
this.name = name;
this.age = age;
this.getName = function () {
console.log(this.name)
}
} obj = new Foo('文州', 19); // 实例化一个对象
obj.getName(); // 输出:文州
2、js中函数名小写,当做函数来处理
function test() {
console.log(this);
}
// 等同于window.test,因此这里的this代指的是window
test(); // 输出:Window
3、自执行函数,同上面等价
自执行函数,同上面等价,this也是代指的window。
(function () {
console.log(this); // 输出:Window
})()
二、复合案例
1、类和函数结合案例
var name = '景女神';
function Foo(name, age) {
this.name = name;
this.age = age;
this.getName = function () {
console.log(this.name); // 文州
(function () {
console.log(this.name); // 景女神(打印的外部全局变量)
})()
}
} obj = new Foo('文州', 19);
obj.getName(); // 文州 景女神
生成对象后,对象执行getName方法,此时this.name是输出的当前对象的name,因此是输出文州。随后再执行自执行函数,这里的this指代的是window对象,获取全局name变量,因此输出景女神。
2、让上例中自执行函数也打印对象的name
var name = '景女神';
function Foo(name, age) {
this.name = name;
this.age = age;
this.getName = function () {
console.log(this.name); // 文州
var that = this;
(function () {
console.log(that.name); // 文州(打印的外部全局变量)
})()
}
} obj = new Foo('文州', 19);
obj.getName(); // 文州 文州
3、自动实例化案例
obj = {
name: '文州',
age: 19,
getName:function () {
console.log(this.name); // 文州
var that = this;
(function () {
console.log(that.name); // 文州
})()
}
}
obj.getName();
JavaScirpt(JS)的this细究的更多相关文章
- JavaScirpt(JS)——js介绍及ECMAScript
一.JavaScript历史发展 JavaScript语言的历史:http://javascript.ruanyifeng.com/introduction/history.html 1994年12月 ...
- JavaScirpt(JS)——DOM文档对象模型
一.HTML DOM介绍 HTML DOM 是 W3C 标准(是 HTML 文档对象模型的英文缩写,Document Object Model for HTML). HTML DOM 定义了用于 HT ...
- JavaScirpt(JS)——BOM浏览器对象模型
一.BOM概念 BOM(Browser Object Model)即浏览器对象模型.可以对浏览器窗口进行访问和操作.使用 BOM,开发者可以移动窗口.改变状态栏中的文本以及执行其他与页面内容不直接相关 ...
- python全栈开发之路
一.Python基础 python简介 python数据类型(数字\字符串\列表) python数据类型(元组\字典) python数据类型(集合) python占位符%s,%d,%r,%f prin ...
- javascirpt对象运用与JS变量
abcdefghijklmnopqrstuvwyz String 对象方法 charAt() 方法可返回指定位置的字符.stringObject.charAt(index)(index从0开始)[ht ...
- [Javascirpt] Developer-friendly Flow Charts with flowchart.js
Flowchart.js is a great tool for creating quick, simple flowcharts in a way that keeps you out of a ...
- js javascirpt 数学库、 算法库 (转载)
提示:国外官网,谷歌浏览器右键可以翻译成中文. 1.math.js 官网:https://mathjs.org/index.html 其它简介:https://www.jianshu.com/p/4f ...
- javascirpt怎样模仿块级作用域(js高程笔记)
因为javascript没有块级作用域的概念,所以在块语句中定义的变量,实际上是在包括函数中而非语句中创建的. 如: function outputNumbers(count){ for(var i= ...
- JS组件系列——BootstrapTable+KnockoutJS实现增删改查解决方案(四):自定义T4模板快速生成页面
前言:上篇介绍了下ko增删改查的封装,确实节省了大量的js代码.博主是一个喜欢偷懒的人,总觉得这些基础的增删改查效果能不能通过一个什么工具直接生成页面效果,啥代码都不用写了,那该多爽.于是研究了下T4 ...
随机推荐
- 八大排序算法的python实现(四)快速排序
代码: #coding:utf-8 #author:徐卜灵 #交换排序.快速排序 # 虽然快速排序称为分治法,但分治法这三个字显然无法很好的概括快速排序的全部步骤.因此我的对快速排序作了进一步的说明: ...
- Resurrectio-capserjs的自动化脚本录制工具
[根据github上的文档说明整理] Phantom下的任何操作都可以录制 Resurrectio是一个Chrome插件,他可以记录浏览器的操作,并转化成对应的casperjs脚本 Resurrect ...
- 3-19bug随即
#方案录入 ### 国外网络访问,录入添加图片,上传后图片显示不出. ``` * 后台有返回数据,前端显示巨慢,待检查 * ``` ### 产品信息,富文本信息加载不出
- screen虚拟终端
screen命令相当于后台执行(虚拟终端) 用法:在一些要执行很久的操作,比如我有个文件有10个G,要传输一天左右,你如果是直接传输,万一你的连接断了.是不是意味着你的操作白费的呢,这时我们可以打开一 ...
- apache的URL重写
apache的url重写 第一步:修改apache\conf目录下的的httpd.conf文件 1.加载apache的url重写模块 大概122行:LoadModule rewrite_module ...
- Python web前端 06 运算符 循环
Python web前端 06 运算符 循环 一.运算符 #JS六大数据类型 #number 数字 #string 字符串 #boolean 布尔型 #function 函数 #undefined 未 ...
- php 其他格式数据与数组互转
class otherArr { private $char="UTF-8"; private $cvs_fege=","; // cvs 分割符 /**数组 ...
- BZOJ - 2115 独立回路 线性基
题意:给定一个图集\((V,E)\),求路径\(1...n\)的最大异或和,其中重复经过的部分也会重复异或 所求既任意一条\(1...n\)的路径的异或和,再异或上任意独立回路的组合的异或和(仔细想想 ...
- HDU - 2203 KMP水题
循环移位的套路操作就是一份折开变两份 /*H E A D*/ void match(){ int n=strlen(T+1); int m=strlen(P+1); int j=0; rep(i,1, ...
- java代码将excel文件中的内容列表转换成JS文件输出
思路分析 我们想要把excel文件中的内容转为其他形式的文件输出,肯定需要分两步走: 1.把excel文件中的内容读出来: 2.将内容写到新的文件中. 举例 一张excel表中有一个表格: 我们需要将 ...