>>分享Web前端开发技术,并对孙卫琴的《精通Vue.js:Web前端开发技术详解》提供技术支持 书籍支持  卫琴直播  品书摘要  在线测试  资源下载  联系我们
发表一个新主题 开启一个新投票 回复文章 您是本文章第 29669 个阅读者 刷新本主题
 * 贴子主题:  JavaScript prototype(原型对象) 回复文章 点赞(0)  收藏  
作者:flybird    发表时间:2020-01-30 23:41:43     消息  查看  搜索  好友  邮件  复制  引用

  

JavaScript prototype(原型对象)

     所有的 JavaScript 对象都会从一个 prototype(原型对象)中继承属性和方法。      

范例

function   Person ( first ,  last ,  age ,  eyecolor )   {
   this . firstName  =  first ;
   this . lastName  =  last ;
   this . age  =  age ;
   this . eyeColor  =  eyecolor ;
}

var   myFather  =  new   Person ( " John " ,  " Doe " ,  50 ,  " blue " ) ;
var   myMother  =  new   Person ( " Sally " ,  " Rally " ,  48 ,  " green " ) ;

     我们也知道在一个已存在的对象构造器中是不能添加新的属性的:    

范例

   Person . nationality  =  " English " ;


       要添加一个新的属性需要在在构造器函数中添加:      

范例

function   Person ( first ,  last ,  age ,  eyecolor )   {
   this . firstName  =  first ;
   this . lastName  =  last ;
   this . age  =  age ;
   this . eyeColor  =  eyecolor ;
   this . nationality  =  " English " ;
}

prototype 继承

所有的 JavaScript 对象都会从一个 prototype(原型对象)中继承属性和方法:    
  •   Date 对象从  Date.prototype 继承。
  •   Array 对象从  Array.prototype 继承。
  •   Person 对象从  Person.prototype 继承。
   所有 JavaScript 中的对象都是位于原型链顶端的 Object 的范例。

         JavaScript 对象有一个指向一个原型对象的链。当试图访问一个对象的属性时,它不仅仅在该对象上搜寻,还会搜寻该对象的原型,以及该对象的原型的原型,依次层层向上搜索,直到找到一个名字匹配的属性或到达原型链的末尾。

          Date 对象,  Array 对象, 以及  Person 对象从  Object.prototype 继承。        

添加属性和方法

     有的时候我们想要在所有已经存在的对象添加新的属性或方法。

         另外,有时候我们想要在对象的构造函数中添加属性或方法。

         使用 prototype 属性就可以给对象的构造函数添加新的属性:

范例

function   Person ( first ,  last ,  age ,  eyecolor )   {
   this . firstName  =  first ;
   this . lastName  =  last ;
   this . age  =  age ;
   this . eyeColor  =  eyecolor ;
}

Person . prototype . nationality  =  " English " ;

  当然我们也可以使用 prototype 属性就可以给对象的构造函数添加新的方法:

范例

function   Person ( first ,  last ,  age ,  eyecolor )   {
   this . firstName  =  first ;
   this . lastName  =  last ;
   this . age  =  age ;
   this . eyeColor  =  eyecolor ;
}

Person . prototype . name  =  function ( )   {
   return   this . firstName  +  "   "  +  this . lastName ;
} ;

程序猿的技术大观园:www.javathinker.net



[这个贴子最后由 sunshine 在 2020-02-02 12:04:28 重新编辑]
  Java面向对象编程-->Java语言的基本语法和规范
  JavaWeb开发-->变量的作用域和初始化
  JSP与Hibernate开发-->Servlet技术详解(Ⅱ)
  Java网络编程-->JSP中使用JavaBean(Ⅱ)
  精通Spring-->Java应用分层架构及软件模型
  Vue3开发-->映射组成关系
  Vue CLI项目的package.json中版本号详解~和^和*的区别
  Vue 3新特性RFC-0026异步组件的全新API
  animate.css动画样式类型库的用法
  JavaScript的HTML DOM Parameter 对象
  JavaScript Error(错误) 对象
  Javascript DOM封装方法汇总
  CSS3 文本效果
  CSS 表单的用法
  CSS Border(边框)
  HTML支持的多媒体(Media)
  JavaScript Array(数组)对象
  JavaScript中的 this关键字
  JavaScript prototype(原型对象)
  JavaScript 正则表达式
  jQuery Mobile 事件
  更多...
 IPIP: 已设置保密
楼主      
1页 0条记录 当前第1
发表一个新主题 开启一个新投票 回复文章


中文版权所有: JavaThinker技术网站 Copyright 2016-2026 沪ICP备16029593号-2
荟萃Java程序员智慧的结晶,分享交流Java前沿技术。  联系我们
如有技术文章涉及侵权,请与本站管理员联系。