老生常谈Javascript中的原型和this指针


Posted in Javascript onOctober 09, 2016

1、Javascript中的原型:

原型prototype是Javascript中特有的一个概念。通过原型,Javascript可以实现继承机制。

Javascript本身是基于原型的,每一个对象都有一个prototype属性。而Object对象的prototype属性为null。

下面来看一个使用原型实现继承的例子:

1.1使用原型实现继承:

 

function Person(name){
  this.name = name;
  this.getName = function(){
    return this.name;
  }
}
function Artist(type){
  this.type = type;
  this.getType = function(){
    return this.type;
  }
}
Artist.prototype = new Person("arthinking");
var artist = new Artist("Guitar");
alert(artist.getType()); //本身就有type属性
alert(artist.getName()); //从Person原型链上继承到的属性和方法

 2、this指针:

Javascript中的this指针与传统的面向对象中的有些不同。传统的面向对象中this指针在类中声明的,表示对象本身。

Javascript中this表示当前上下文,即调用者的引用。Javascript中this代表的对象不是根据函数的声明而确定的,而是根据的调用而确定的。下面展示了一个函数中的this使用call指定具体代表的对象:

var test1 = {
  name : "test1"
}
var test2 = {
  name : "test2"
}
function getName(){
  return this.name; //this根据传调用该函数的上下文来确定的,定义该函数时,this指针并不确定
}
alert(getName.call(test1));

这里的call是Function的一个函数。

以上就是小编为大家带来的老生常谈Javascript中的原型和this指针全部内容了,希望大家多多支持三水点靠木~

Javascript 相关文章推荐
模仿JQuery sortable效果 代码有错但值得看看
Nov 05 Javascript
javascript 伪数组实现方法
Oct 11 Javascript
js创建一个input数组并绑定click事件的方法
Jun 12 Javascript
SuperSlide2实现图片滚动特效
Jun 20 Javascript
jQuery中用dom操作替代正则表达式
Dec 29 Javascript
JS实现跟随鼠标闪烁转动色块的方法
Feb 26 Javascript
js中通过getElementsByName访问name集合对象的方法
Oct 31 Javascript
基于Phantomjs生成PDF的实现方法
Nov 07 Javascript
Jquery Easyui选项卡组件Tab使用详解(10)
Dec 18 Javascript
Node.js通过身份证号验证年龄、出生日期与性别方法示例
Mar 09 Javascript
Vue+Element使用富文本编辑器的示例代码
Aug 14 Javascript
vue 虚拟dom的patch源码分析
Mar 01 Javascript
浅谈Javascript中的函数、this以及原型
Oct 09 #Javascript
常用Javascript函数与原型功能收藏(必看篇)
Oct 09 #Javascript
javascript汉字拼音互转的简单实例
Oct 09 #Javascript
Javascript农历与公历相互转换的简单实例
Oct 09 #Javascript
Angularjs 创建可复用组件实例代码
Oct 09 #Javascript
Boostrap实现的登录界面实例代码
Oct 09 #Javascript
深入理解bootstrap框架之第二章整体架构
Oct 09 #Javascript
You might like
使用PHP批量生成随机用户名
2008/07/10 PHP
具有时效性的php加密解密函数代码
2013/06/19 PHP
PHP 利用Mail_MimeDecode类提取邮件信息示例
2014/01/26 PHP
PHP实现GIF图片验证码
2015/11/04 PHP
JS类库Bindows1.3中的内存释放方式分析
2007/03/08 Javascript
Mootools 1.2教程 输入过滤第一部分(数字)
2009/09/15 Javascript
node.js中的fs.truncateSync方法使用说明
2014/12/15 Javascript
JS中处理时间之setUTCMinutes()方法的使用
2015/06/12 Javascript
Webpack 实现 AngularJS 的延迟加载
2016/03/02 Javascript
javascript url几种编码方式详解
2016/06/06 Javascript
JS模仿腾讯图片站的图片翻页按钮效果完整实例
2016/06/21 Javascript
Vue.JS入门教程之事件监听
2016/12/01 Javascript
Vue概念及常见命令介绍(1)
2016/12/08 Javascript
node学习记录之搭建web服务器教程
2017/02/16 Javascript
Vue.js实现一个SPA登录页面的过程【推荐】
2017/04/29 Javascript
JS验证码实现代码
2017/09/14 Javascript
深入理解vue中slot与slot-scope的具体使用
2018/01/26 Javascript
js实现input密码框显示/隐藏功能
2020/09/10 Javascript
深度了解vue.js中hooks的相关知识
2019/06/14 Javascript
使用Vue开发自己的Chrome扩展程序过程详解
2019/06/21 Javascript
layui点击数据表格添加或删除一行的例子
2019/09/12 Javascript
微信小程序tabBar设置实例解析
2019/11/14 Javascript
javascript实现前端成语点击验证优化
2020/06/24 Javascript
在vant 中使用cell组件 定义图标该图片和位置操作
2020/11/02 Javascript
[40:12]Liquid vs Chaos 2019国际邀请赛小组赛 BO2 第二场 8.15
2019/08/16 DOTA
Python多线程、异步+多进程爬虫实现代码
2016/02/17 Python
Python使用re模块实现信息筛选的方法
2018/04/29 Python
python+selenium select下拉选择框定位处理方法
2019/08/24 Python
css3过渡_动力节点Java学院整理
2017/07/11 HTML / CSS
CSS3+Sprite实现僵尸行走动画特效源码
2016/01/27 HTML / CSS
给实习单位的感谢信
2014/02/01 职场文书
中国梦读书活动总结
2014/07/10 职场文书
2014年服务员工作总结
2014/11/18 职场文书
2014年秘书工作总结
2014/11/25 职场文书
小班下学期个人总结
2015/02/12 职场文书
委托书范本格式
2019/04/18 职场文书