JavaScript中的this关键字介绍与使用实例


Posted in Javascript onJune 21, 2013

当创建一个类的时候,如果希望下面new出来的每个类都拥有一些通用的变量或者其他的函数,这个this关键字这是最好的方式。

当然,既然是面向对象的语言,必然存在访问权限的问题,这里也和this关键字息息相关。下面我们来演示一个例子来说明一下这个类的访问权限的问题.

//Person类  
   function Person(){ 
    var name="abc";//var声明的都是类内部的私有变量,外部无法访问  
    var age = 20;     this.name2="edg";//this声明的是公开变量,外部可以访问  
    this.show=function(){//shou方法是公开的方法,可以被外部访问,而且可以访问类内部私有方法  
    window.alert(name); 
    } 
    function show2(){//shouw2方法是类内部的私有方法,不能被外部访问  
    } 
} 
var p1 = new Person(); 
document.writeln(p1.name2+p1.name); 
p1.show(); 
 //Person类 3water.com
    function Person(){
  var name="abc";//var声明的都是类内部的私有变量,外部无法访问
  var age = 20;
  this.name2="edg";//this声明的是公开变量,外部可以访问
  this.show=function(){//shou方法是公开的方法,可以被外部访问,而且可以访问类内部私有方法
  window.alert(name);
  }
  function show2(){//shouw2方法是类内部的私有方法,不能被外部访问
  }
 }

 var p1 = new Person();
 document.writeln(p1.name2+p1.name);
 p1.show();

这个Person其实就是一个类,类名就是Person,其中声明的变量,var开头的都是私有变量,只能在类的内部实现访

问,而通过this关键字声明的变量是公有的变量,可以在外部访问。当然,只需要公开一个方法,就可以实现外部访

问类内部的私有变量,这个this.show=function(){}就是声明一个共有方法,在类的外部也是可以调用的。当然,以此

类推,直接声明的方法是私有的方法/

下面再看一个例子

function test(){ 
    alert(this.v); 
} 
var v = 902; 
window.test(); 
 function test(){
  alert(this.v);
 }
 var v = 902;
 window.test();

代码很简短,这个的意思是,谁调用的这个方法,这个this就是指的那个对象,比如,window对象调用的test方法,

所以在test方法内部,这个this,v就是指在window也就是外部全局是否定义了一个v变量,通过查看可以知道,定义了

一个var v = 902;所以这个方法调用的其实就是v的值.

Javascript 相关文章推荐
xml转json的js代码
Aug 28 Javascript
JS获取数组最大值、最小值及长度的方法
Nov 24 Javascript
javascript禁止超链接跳转的方法
Feb 02 Javascript
移动端滑动插件Swipe教程
Oct 16 Javascript
JavaScript中在光标处插入添加文本标签节点的详细方法
Mar 22 Javascript
vue小白入门教程
Apr 02 Javascript
Vue.js子组件向父组件通信的方法实例代码详解
Dec 10 Javascript
详解微信小程序的不同函数调用的几种方法
May 08 Javascript
Vue keepAlive 数据缓存工具实现返回上一个页面浏览的位置
May 10 Javascript
微信小程序云开发之使用云函数
May 17 Javascript
通过vue写一个瀑布流插件代码实例
Sep 07 Javascript
Vue Render函数创建DOM节点代码实例
Jul 08 Javascript
js验证模型自我实现的具体方法
Jun 21 #Javascript
JS验证控制输入中英文字节长度(input、textarea等)具体实例
Jun 21 #Javascript
无缝滚动js代码通俗易懂(自写)
Jun 19 #Javascript
HTML5之lang属性与dir属性的详解
Jun 19 #Javascript
jQuery之ajax技术的详细介绍
Jun 19 #Javascript
jQuery之尺寸调整组件的深入解析
Jun 19 #Javascript
jQuery之排序组件的深入解析
Jun 19 #Javascript
You might like
NT IIS下用ODBC连接数据库
2006/10/09 PHP
php通过递归方式复制目录和子目录的方法
2015/03/13 PHP
PHP 搜索查询功能实现
2016/11/29 PHP
jquery插件制作 手风琴Panel效果实现
2012/08/17 Javascript
JQuery结合CSS操作打印样式的方法
2013/12/24 Javascript
JS实现将人民币金额转换为大写的示例代码
2014/02/13 Javascript
表单序列化与jq中的serialize使用示例
2014/02/21 Javascript
Javascript中arguments对象详解
2014/10/22 Javascript
JavaScript判断是否为数字的4种方法及效率比较
2015/04/01 Javascript
jquery可定制的在线UEditor编辑器
2015/11/17 Javascript
学习JavaScript图片预加载模块
2016/11/07 Javascript
bootstrap手风琴折叠示例代码分享
2017/05/22 Javascript
JS解决position:sticky的兼容性问题的方法
2017/10/17 Javascript
基于vue 开发中出现警告问题去除方法
2018/01/25 Javascript
angular 实现的输入框数字千分位及保留几位小数点功能示例
2018/06/19 Javascript
jQuery添加新内容的四个常用方法分析【append,prepend,after,before】
2019/03/19 jQuery
使用webpack编译es6代码的方法步骤
2019/04/28 Javascript
Vue组件间通信 Vuex的用法解析
2019/08/05 Javascript
基于Vue.js与WordPress Rest API构建单页应用详解
2019/09/16 Javascript
Python os模块中的isfile()和isdir()函数均返回false问题解决方法
2015/02/04 Python
利用Python读取文件的四种不同方法比对
2017/05/18 Python
Numpy数组的保存与读取方法
2018/04/04 Python
利用Python如何批量更新服务器文件
2018/07/29 Python
Python将string转换到float的实例方法
2019/07/29 Python
python实现单目标、多目标、多尺度、自定义特征的KCF跟踪算法(实例代码)
2020/01/08 Python
Anaconda+VSCode配置tensorflow开发环境的教程详解
2020/03/30 Python
解决Python安装cryptography报错问题
2020/09/03 Python
为2021年的第一场雪锦上添花:用matplotlib绘制雪花和雪景
2021/01/05 Python
html5 Canvas画图教程(8)—canvas里画曲线之bezierCurveTo方法
2013/01/09 HTML / CSS
仓库门卫岗位职责
2013/12/22 职场文书
教师节商场活动方案
2014/02/13 职场文书
计算机实训报告总结
2014/11/05 职场文书
妈妈再爱我一次观后感
2015/06/08 职场文书
详细聊聊关于Mysql联合查询的那些事儿
2021/10/24 MySQL
Win11如何设置右键单击显示所有选项?Win11右键单击显示所有选项设置教程
2022/04/08 数码科技
java中为什么说子类的构造方法默认访问的是父类的无参构造方法
2022/04/13 Java/Android