js中this的用法实例分析

 实例1:第一种调用this的方法——以函数形式调用。它代表全局对象window

 代码如下:
<script type="text/javascript">
function t(){
 alert(this);//这里this表示window对象。
}
t();
</script>

实例2:第二种调用this的方法——以对象属性的形式调用。它代表该对象。实例中onclick为p元素对象的属性

代码如下:
<html>
<head>
<script type="text/javascript">
function t(){
 alert(this);
 this.style.background = 'green';
}
window.onload = function(){
 document.getElementById('eng').onclick = t;
}
</script>
</head>
<body>
<p id="eng">abcd</p>
</body>
</html>

实例3:第三种调用this的方法——以构造器的方式调用。

代码如下:
<script type="text/javascript">
function dog(){
 this.legs = 4;
 this.bark = function(){
  alert("汪汪...");
 }
}
var wangcai = new dog();//创建对象的方式。new 函数名();
wangcai.bark();
</script>

说明:
(1)如果直接调用dog()函数,而不是以创建对象的方式调用,则相当于第一种调用了,即this代表着全局对象window。
(2)js中没有类的概念,但是有对象的概念;
(3)对象的创建可以采用var = objName{name:'abc',age:40}这种方式创建,也可以通过构造函数来创建;
(4)什么是构造函数:当一个普通函数以“new 函数名()”的方式调用时,此函数就充当构造函数。

 

实例4:第四种调用this的方法——call和apply方式

代码如下:
<html>
<head>
<script type="text/javascript">
window.onload = function(){
 var d = document.getElementById('hi');
 if(hi.addEventListener){//chrome 和 firefox
  hi.addEventListener('click',function(){alert(this.id)},false);//w3c模型中,this指向DOM对象。this.id结果为hi
 }else{// ie
  hi.attachEvent('onclick',function(){alert(this.id)});//ie8及ie8以下,这里this指向全局对象window。结果this.id结果为undefined
 }
}
</script>
</head>
<body>
<p id="hi">hello world</p>
</body>
</html>

时间: 2025-01-30 07:49:37

js中this的用法实例分析的相关文章

JS中prototype的用法实例分析

 这篇文章主要介绍了JS中prototype的用法,实例分析了JS中prototype的常见使用技巧,具有一定参考借鉴价值,需要的朋友可以参考下     本文实例讲述了JS中prototype的用法.分享给大家供大家参考.具体分析如下: JS中的phototype是JS中比较难理解的一个部分 本文基于下面几个知识点: 1 原型法设计模式 在.Net中可以使用clone()来实现原型法 原型法的主要思想是,现在有1个类A,我想要创建一个类B,这个类是以A为原型的,并且能进行扩展.我们称B的原型为A

js中this的用法实例分析_javascript技巧

本文实例分析了js中this的用法.分享给大家供大家参考.具体分析如下: 实例1:第一种调用this的方法--以函数形式调用.它代表全局对象window 复制代码 代码如下: <script type="text/javascript"> function t(){  alert(this);//这里this表示window对象. } t(); </script> 实例2:第二种调用this的方法--以对象属性的形式调用.它代表该对象.实例中onclick为p元

JS中prototype的用法实例分析_javascript技巧

本文实例讲述了JS中prototype的用法.分享给大家供大家参考.具体分析如下: JS中的phototype是JS中比较难理解的一个部分   本文基于下面几个知识点:  1 原型法设计模式 在.Net中可以使用clone()来实现原型法 原型法的主要思想是,现在有1个类A,我想要创建一个类B,这个类是以A为原型的,并且能进行扩展.我们称B的原型为A.  2 javascript的方法可以分为三类: a 类方法 b 对象方法 c 原型方法 例子如下: function People(name)

php中return的用法实例分析

 这篇文章主要介绍了php中return的用法,实例分析了php中return的功能及常见的使用技巧,具有一定参考借鉴价值,需要的朋友可以参考下     本文实例讲述了php中return的用法.分享给大家供大家参考.具体分析如下: 首先,它的意思就是返回;return()是语言结构而不是函数,仅在参数包含表达式时才需要用括号将其括起来.当返回一个变量时通常不用括号,这样可以降低PHP的负担. 基本用法: a).return expression // 返回一个表达式结果 b).return(e

js常用系统函数用法实例分析

 这篇文章主要介绍了js常用系统函数用法,实例分析了escape.parseInt.parseFloat.isNaN.isFinite等函数的用法,具有一定参考借鉴价值,需要的朋友可以参考下     本文实例讲述了js常用系统函数用法.分享给大家供大家参考. 具体代码如下: 代码如下: <html> <head> </head> <body> <script type="text/javascript"> //1. escap

JQuery中extend的用法实例分析

 这篇文章主要介绍了JQuery中extend的用法,实例分析了extend的功能.定义及相关使用技巧,需要的朋友可以参考下     本文实例讲述了JQuery中extend的用法.分享给大家供大家参考.具体分析如下: extend()函数是jQuery的基础函数之一,作用是扩展现有的对象.extend是我们在写插件的过程中常用的方法,该方法有一些重载原型.$.extend(prop) 用于扩展jQuery对象,可以用于把函数添加到jQuery名称空间中. 一.jQuery.extend函数的源

jquery中filter方法用法实例分析

 这篇文章主要介绍了jquery中filter方法用法,实例分析了filter方法的功能并对比了与find方法的区别,需要的朋友可以参考下     本文实例讲述了jquery中filter方法用法.分享给大家供大家参考.具体分析如下: filter()方法将匹配元素集合缩减为匹配指定选择器的元素. filter方法中的参数可以为字符串值,包含供匹配当前元素集合的选择器表达式. 一.filter的参数类型可分为两种 1.传递选择器 $('a').filter('.external') 2.传递过滤

php中return的用法实例分析_php技巧

本文实例讲述了php中return的用法.分享给大家供大家参考.具体分析如下: 首先,它的意思就是返回;return()是语言结构而不是函数,仅在参数包含表达式时才需要用括号将其括起来.当返回一个变量时通常不用括号,这样可以降低PHP的负担. 基本用法: a).return expression // 返回一个表达式结果 b).return(expr) // 函数表达式 c).return // 直接返回,或返回空值 注意:最好不要用return($val)这种方式. 1.如果执行了return

JSP页面文件中base标记用法实例分析_JSP编程

本文实例分析了JSP页面文件中base标记用法.分享给大家供大家参考,具体如下: 我们在用IDE工具生成JSP页面时通常都包含下面的两段代码, <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %