JScript中的"this"关键字使用方式补充材料


Posted in Javascript onMarch 08, 2007

在"JavaScript中this关键字使用方法详解"一文中,我曾例举了在JavaScript和JScript中的8种this关键字的方式。这不又发现还有两种this关键字的使用方式当时没有说到,现补充说明一下。并且通过第一种this关键字使用的说明,能让我们更好的理解JavaScript作为Object-Based语言的本质。

    一种是和JavaScript类中的定义有关,我们知道当我们定义如下类的时候:  

function JSClass()
{
}

JSClass.prototype.m_Properties = 100;

JSClass.prototype.ToString = function()
{
    alert(this.m_Properties);
}

    方法ToString中的this.m_Properties就是100,那么下面这种定义呢? 

function JSClass()
{
}

JSClass.m_Properties = -100;

JSClass.ToString()
{
    alert(this.m_Properties);
}

    这时ToString中的这个this.m_Properties是啥?是-100。一定吗?这个不一定了,这得看我们怎么调用这个ToString方法。 

JSClass.ToString();
var fun = JSClass.ToString();
fun();
    这时的运行结果居然是:-100和undefined。真是郁闷哈,怎么才能运行fun得到-100呢?需要这样来为fun赋值:

var fun = function() { JSClass.ToString(); }
fun();
    呵呵,这样就是-100了。好像挺废话的,最终不还是调用的JSClass.ToString()吗?这个我们后面再说,看看把这两个JSClass合在一起是什么情况呢? 

function JSClass()
{
}

JSClass.m_Properties = -100;
JSClass.prototype.m_Properties = 100;

JSClass.ToString = function()
{
    alert(this.m_Properties);
}

JSClass.prototype.ToString = function()
{
    alert(this.m_Properties);
}

    这两个ToString()方法,和里面的this关键字它们是什么关系呢?看下面的示例: 

var jsclass = new JSClass();
jsclass.ToString();
JSClass.ToString();
    结果为:100和-100。这里的jsclass实际上是JavaScript的语言机制,通过new关键字的说明来创建的一个新的实例。而JSClass是什么呢?他们本就是对象实例,只是长得像个函数,也像一个类的说明。对于this的问题,第一个jsclass.ToString()方法里的this是指新创建实例,而JSClass.ToString()方法里的this是值得JSClass这个对象实例。

    理解了这两个this所指代的东西的不同本质,也就能更好的明白,为什么JavaScript叫做Object-Based的语言,而更加清楚它和Object-Oriented语言的本质区别。

    回头再说一下补充第二中this的使用方法,就是在使用eval方法的时候,这个时候的this是什么呢?看看:

alert(this === eval("this"));
    的结果是什么?是true!这是因为eval内代码被执行的作用域就是当前页面本身的说。

Javascript 相关文章推荐
编写跨浏览器的javascript代码必备[js多浏览器兼容写法]
Oct 29 Javascript
js之事件冒泡和事件捕获详细介绍
Oct 28 Javascript
jQuery实现点击文本框弹出热门标签的提示效果
Nov 17 Javascript
jQuery向上遍历DOM树之parents(),parent(),closest()之间的区别
Dec 02 Javascript
javascript实现十六进制颜色值(HEX)和RGB格式相互转换
Jun 20 Javascript
详解JavaScript ES6中的模板字符串
Jul 28 Javascript
JS中常用的正则表达式
Sep 29 Javascript
Vue.set()实现数据动态响应的方法
Feb 07 Javascript
Koa 使用小技巧(小结)
Oct 22 Javascript
Vue 指令实现按钮级别权限管理功能
Apr 23 Javascript
vue中解决拖拽改变存在iframe的div大小时卡顿问题
Jul 22 Javascript
Javascript call及apply应用场景及实例
Aug 26 Javascript
function, new function, new Function之间的区别
Mar 08 #Javascript
JavaScript中this关键字使用方法详解
Mar 08 #Javascript
区分JS中的undefined,null,"",0和false
Mar 08 #Javascript
在JavaScript中使用inline函数的问题
Mar 08 #Javascript
JS类中定义原型方法的两种实现的区别
Mar 08 #Javascript
JavaScript语言中的Literal Syntax特性分析
Mar 08 #Javascript
从JavaScript的函数重名看其初始化方式
Mar 08 #Javascript
You might like
PHP无刷新上传文件实现代码
2011/09/19 PHP
PHP面向对象之里氏替换原则简单示例
2018/04/08 PHP
PHP中的自动加载操作实现方法详解
2019/08/06 PHP
jQuery参数列表集合
2011/04/06 Javascript
javascript预加载图片、css、js的方法示例介绍
2013/10/14 Javascript
javascript 按键事件(兼容各浏览器)
2013/12/20 Javascript
iframe父页面获取子页面参数的方法
2014/02/21 Javascript
jQuery中prev()方法用法实例
2015/01/08 Javascript
Jquery日期选择datepicker插件用法实例分析
2015/06/08 Javascript
javascript背景时钟实现方法
2015/06/18 Javascript
JavaScript学习笔记之数组的增、删、改、查
2016/03/23 Javascript
非常棒的jQuery图片轮播效果
2016/04/17 Javascript
jQuery实现的自定义滚动条实例详解
2016/09/20 Javascript
jQuery中DOM节点删除之empty与remove
2017/01/20 Javascript
axios实现文件上传并获取进度
2020/03/25 Javascript
[44:01]2018DOTA2亚洲邀请赛3月30日 小组赛B组 EG VS paiN
2018/03/31 DOTA
wxPython 入门教程
2008/10/07 Python
Python数据库的连接实现方法与注意事项
2016/02/27 Python
Win7下Python与Tensorflow-CPU版开发环境的安装与配置过程
2018/01/04 Python
Python调用C语言的方法【基于ctypes模块】
2018/01/22 Python
解决python有时候import不了当前的包问题
2019/08/28 Python
python海龟绘图之画国旗实例代码
2020/11/11 Python
CSS3与动画有关的属性transition、animation、transform对比(史上最全版)
2017/08/18 HTML / CSS
美国婚礼和派对礼品网站:Kate Aspen(新娘送礼会、迎婴派对)
2018/03/28 全球购物
世界顶级俱乐部的官方球衣和套装:Subside Sports
2018/04/22 全球购物
Tom Dixon官网:英国照明及家具设计和制造公司
2019/03/01 全球购物
女大学生毕业找工作的自我评价
2013/10/03 职场文书
汽车检测与维修应届毕业生求职信
2013/10/19 职场文书
考试违纪检讨书
2014/02/02 职场文书
酒店管理求职信范文
2014/04/06 职场文书
学校安全工作汇报材料
2014/08/16 职场文书
教师个人考察材料
2014/12/16 职场文书
辞职信怎么写?你都知道吗?
2019/06/24 职场文书
Python关于OS文件目录处理的实例分享
2021/05/23 Python
SQL Server2019安装的详细步骤实战记录(亲测可用)
2022/06/10 SQL Server
Go微服务项目配置文件的定义和读取示例详解
2022/06/21 Golang