prototype （一）

最新推荐文章于 2022-09-04 17:09:52 发布
最新推荐文章于 2022-09-04 17:09:52 发布
阅读量325 收藏
点赞数
分类专栏： js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/nzf_001/article/details/28865687
版权
解析一：
　　prototype（原型）
　　在JavaScript中，prototype对象是实现面向对象的一个重要机制。
　　每个函数就是一个对象（Function），函数对象都有一个子对象 prototype对象，类是以函数的形式来定义的。prototype表示该函数的原型，也表示一个类的成员的集合。
　　在通过new创建一个类的实例对象的时候，prototype对象的成员都成为实例化对象的成员。
　　1、该对象被类所引用，只有函数对象才可引用；
　　2、在new实例化后，其成员被实例化，实例对象方可调用。

　　同时，函数是一个对象，函数对象若直接声明成员，不用被实例化即可调用。

 

prototype.js　　

 

prototype.js是由Sam Stephenson写的一个javascript类库。这个构思奇妙，而且兼容标准的类库，能帮助你轻松建立有高度互动的web2.0特性的富客户端页面。

　　一些实用的函数

　　这个类库带有很多预定义的对象和实用函数，这些东东的目的显然是把你从一些重复的打字中解放出来 。

　　使用$()方法

　　$() 方法是在DOM中使用过于频繁的 document.getElementByIdx() 方法的一个便利的简写，就像这个DOM方法一样，这个方法返回参数传入的id的那个元素。

　　比起DOM中的方法，这个更胜一筹。你可以传入多个id作为参数然后 $() 返回一个带有所有要求的元素的一个 Array 对象。

　　<HTML>

　　<HEAD>

　　<TITLE> Test Page </TITLE>

　　<script src="prototype-1.3.1.js"></script>

　　<script>

　　function test1()

　　{

　　var d = $('myDiv');

　　alert(d.innerHTML);

　　}

　　function test2()

　　{

　　var divs = $('myDiv','myOtherDiv');

　　for(i=0; i<divs.length; i++)

　　{

　　alert(divs.innerHTML);

　　}

　　}

　　</script>

　　</HEAD>

　　<BODY>

　　<div id="myDiv">

　　<p>This is a paragraph</p>

　　</div>

　　<div id="myOtherDiv">

　　<p>This is another paragraph</p>

　　</div>

　　<input type="button" value=Test1 οnclick="test1();"><br>

　　<input type="button" value=Test2 οnclick="test2();"><br>

　　</BODY>

　　</HTML>另外一个好处是，这个函数能传入用string表示的对象ID，也可以传入对象本身，这样，在建立其它能传两种类型的参数的函数时非常有用。

　　使用$F()函数

　　$F()函数是另一个大收欢迎的“快捷键”，它能用于返回任何表单输入控件的值，比如text box,drop-down list。这个方法也能用元素id或元素本身做为参数。

　　<script>

　　function test3()

　　{

　　alert( $F('userName') );

　　}

　　</script>

　　<input type="text" id="userName" value="Joe Doe"><br>

　　<input type="button" value=Test3 οnclick="test3();"><br>

　　使用$A()函数

　　$A()函数能把它接收到的单个的参数转换成一个Array对象。

　　这个方法，结合被本类库扩展了的Array类，能方便的把任何的可枚举列表转换成或拷贝到一个Array对象。一个推荐的用法就是把DOM Node Lists转换成一个普通的Array对象，从而更有效率的进行遍历，请看下面的例子。

　　<script>

　　function showOptions(){

　　var someNodeList = $('lstEmployees').getElementsByTagName_r('option');

　　var nodes = $A(someNodeList);

　　nodes.each(function(node){

　　alert(node.nodeName + ': ' + node.innerHTML);

　　});

　　}

　　</script>

　　<select id="lstEmployees" size="10" >

　　<option value="5">Buchanan, Steven</option>

　　<option value="8">Callahan, Laura</option>

　　<option value="1">Davolio, Nancy</option>

　　</select>

　　<input type="button" value="Show the options" οnclick="showOptions();" >

　　使用 $H() 函数

　　$H()函数把一些对象转换成一个可枚举的和联合数组类似的Hash对象。

　　<script>

　　function testHash()

　　{

　　//let's create the object

　　var a = {

　　first: 10,

　　second: 20,

　　third: 30

　　};

　　//now transform it into a hash

　　var h = $H(a);

　　alert(h.toQueryString()); //displays: first=10&second=20&third=30

　　}

　　</script>

　　使用$R()函数

　　$R()是new ObjectRange(lowBound,upperBound,excludeBounds)的缩写。

　　跳到ObjectRange 类文档可以看到一个关于此类的完整描述. 此时，我们还是先来看一个例子以展示这个缩写能代替哪些方法吧。其它相关的一些知识可以在Enumerable 对象文档中找到。

　　<script>

　　function demoDollar_R(){

　　var range = $R(10, 20, false);

　　range.each(function(value, index){

　　alert(value);

　　});

　　}

　　</script>

　　<input type="button" value="Sample Count" οnclick="demoDollar_R();" >

　　使用Try.these()函数

　　Try.these() 方法使得实现当你想调用不同的方法直到其中的一个成功正常的这种需求变得非常容易， 他把一系列的方法作为参数并且按顺序的一个一个的执行这些方法直到其中的一个成功执行，返回成功执行的那个方法的返回值。

　　在下面的例子中， xmlNode.text在一些浏览器中好用，但是xmlNode.textContent在另一些浏览器中正常工作。 使用Try.these()方法我们可以得到正常工作的那个方法的返回值。

　　<script>

　　function getXmlNodeValue(xmlNode){

　　return Try.these(

　　function() {return xmlNode.text;},

　　function() {return xmlNode.textContent;)

　　);

　　}

　　</script>

 

 

 

来源于百度百科

 

zhizunbao_nie
关注
专栏目录
Prototype Learning整理
Lemon Sun
11-20 4481
已经确定保研，时间也比较清闲，就跟着本科的导师每周参加她带的研究生的组会，也读些论文做做报告。 把最近读的五篇原型学习的相关论文整理出了一个概述，放出来存个档。 前两篇是人脸识别，第三篇是亲属关系鉴定，后两篇是心理认知领域的。
比较详细的javascript对象的property和prototype是什么一种关系
10-30
然后，我们设置 `MyObject2` 的 Prototype 属性为一个 `MyObject1` 对象，这样，`MyObject2` 的 Prototype 链就包含了 `MyObject1` 对象。 Property 和 Prototype 的关系 在取值操作中，Property 和 Prototype 的...
关于是否所有函数都有prototype一说
围巾落地的博客
08-23 3093
关于是否所有函数都有prototype一说 个人主页原文链接 参见ES国际标准 [外链图片转存失败(img-tUzys4uy-1566549503318)(https://user-images.githubusercontent.com/44082279/62816783-057ee400-bb5f-11e9-8295-d832b0f76e78.png)] 使用Function.prototy...
详解prototype
qq_36470686的博客
10-05 882
什么是prototype   prototype属性是函数对象的子对象。函数是一个对象，它们对应的类就是function，每个函数对象都具有一个子对象prototype。 prototype包含特定类型的所有实例共享的属性和方法。对普通函数来说这个属性没什么用，只有在构造函数创建实例的时候该属性有用。当通过new来生成一个类的对象时，prototype对象的属性就会成为实例化对象的属性。 ...
prototype
_valora的博客
05-30 990
prototype：显示原型。每一个函数对象都有一个显示的prototype属性,它代表了对象的原型(Function.prototype函数对象是个例外，没有prototype属性)。 __proto__：隐式原型。每个对象都有一个名为__proto__的内部隐藏属性，指向于它所对应的原型对象(chrome、firefox中名称为__proto__，并且可以被访问到)。原型链正是基于__proto__才得以形成(注：不是基于函数对象的属性prototype)。
是否所有函数都有prototype
追随大神的脚步
05-11 1573
是否所有函数都有prototype 使用Function.prototype.bind创建的函数对象 function abc(){console.log('abc')} var binded = abc.bind(null) binded() //abc console.log(binded.prototype) //undefined 箭头函数也没有 var abc = ()=>{console.log('abc')} abc() //abc console.log(abc.prototype)
JS中的Prototype
山鬼谣弋痕夕的博客
07-11 1051
var dom = function(){ }; dom.Show = function(){ alert("Show Message"); }; dom.prototype.Display = function(){ alert("Property Message"); }; dom....
JavaScript Prototype介绍
开发中的点点滴滴
12-29 1598
介绍一 用过JavaScript的同学们肯定都对prototype如雷贯耳，但是这究竟是个什么东西却让初学者莫衷一是，只知道函数都会有一个prototype属性，可以为其添加函数供实例访问，其它的就不清楚了，最近看了一些 JavaScript高级程序设计，终于揭开了其神秘面纱。 每个函数都有一个prototype属性，这个属性是指向一个对象的引用，这个对象称为原型对象，原型对象包含函数
singleton和prototype
taxusw的博客
09-04 947
IOC中怎样创建单例对象和多实例对象
prototype 原型
呦呵的博客
05-26 870
一、原型 1.原型对象prototype的定义 javascript中的每个对象都有prototype属性，Javascript中对象的prototype属性的解释是：返回对象类型原型的引用。 每一个构造函数都有一个属性叫做原型。这个属性非常有用：为一个特定类声明通用的变量或者函数。 每一个函数对象都有一个prototype属性，但是普通对象是没有的。可以把公用的属性和方法，直接定义在prototype对象属性。 普通对象：字符串、数组、数字… 函数对象：function 在 JavaScript 中，对象
JavaScript知识点之prototype
玉案轩窗的博客
08-18 2024
前言prototype是所有函数都有的内置属性，prototype属性的值是对象，该对象称之为原型对象。原型是Js的核心概念之一，它引申出继承、原型链等其他概念，本文就详细的分析总结下prototype的相关知识点。在理解prototype之前，我觉得有必要讲讲面向对象，当然这里不会讲很多，就讲讲Js的面向对象与Java面向对象的区别。 联系：都是面向对象编程 区别：
找到了一篇jQuery与Prototype并存的冲突的解决方法
10-30
方法一：将jquery.js放到prototype.js后面 在使用jQuery和Prototype时，我们可以将jquery.js文件放到prototype.js文件后面。这样，可以确保 jQuery 对象的变量名 `$` 不会被 Prototype 对象覆盖。例如： ```html ...
prototype Element学习笔记(篇一)
09-06
在JavaScript的世界里，Prototype库是一个非常重要的框架，它为JavaScript的原生对象提供了大量的扩展，大大简化了DOM操作。在Prototype中，`Element`和`Selector`是两个核心概念，它们是实现高效和便捷的DOM操作的...
Prototype源码浅析 String部分(一)之有关indexOf优化
09-05
Prototype是一个JavaScript框架，它提供了一套丰富的类库来简化JavaScript编程，尤其在旧版浏览器中。本文主要分析了Prototype框架在字符串操作方面的源码，特别是对indexOf方法的优化实现。 首先，文章提到...
prototype一个简单的ajax例子
05-27
在本示例中，我们使用的是一种JavaScript库——Prototype，它为JavaScript提供了许多实用的工具和功能，包括对Ajax的优雅封装。Prototype简化了Ajax操作，使得开发者可以更方便地与服务器进行异步数据交互。 ...
问号和冒号----条件运算符
nzf_001的专栏nzf_001的专栏nzf_001的专栏nzf_001的专栏nzf_001的专栏
06-06 7757
== 是等于号 = 是赋值号 ? : 看好了，问号和冒号是一起用的，叫条件运算符。 语法： 条件表达式 ? 真值 : 假值 这个表式式由三部分组成的，如果条件表达式的值为真，则整个表达式的值为“真值”的值，反之为“假值”的值。 例： a>b?c:d 如果a>b，表达式值为c 如果a 在多数计算机语言中都支持条件运算 换一种方式它可以代替if...else..这个条件语句 变量=布尔表达式？语句
Js 网站变灰(网页黑白)效果代码(兼…
nzf_001的专栏nzf_001的专栏nzf_001的专栏nzf_001的专栏nzf_001的专栏
06-06 4320
下面开始讲网站变灰方法，方法而已 1、IE滤镜法。 在CSS里面加上如下代码： html { filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); } 或者 html {FILTER: gray;} 优点：代码简单 缺点：IE ONLY，其他浏览器无效，而且IE下占用内存厉害   2、grayscale 使用方法
兼容chorme和Safari的javascript设…
nzf_001的专栏nzf_001的专栏nzf_001的专栏nzf_001的专栏nzf_001的专栏
06-06 1070
以前也做过这样的、可今天又碰到就在网上找了找代码、发现大部分都是不兼容的、后来找到一个兼容性好点的、不过也只兼容ie和FF、、不兼容chorme和Safari 有木全部兼容的啊 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transit
欢迎使用CSDN-markdown编辑器dfas
nzf_001的专栏nzf_001的专栏nzf_001的专栏nzf_001的专栏nzf_001的专栏
08-03 700
欢迎使用Markdown编辑器写博客本Markdown编辑器使用StackEdit修改而来，用它写博客，将会带来全新的体验哦： Markdown和扩展Markdown简洁的语法 代码块高亮 图片链接和图片上传 LaTex数学公式 UML序列图和流程图 离线写博客 导入导出Markdown文件 丰富的快捷键 快捷键 加粗 Ctrl + B 斜体 Ctrl + I 引用 Ctrl
深入理解JavaScript prototype属性
- **默认原型**：每个函数对象都有一个默认的prototype属性，其中包含了一个构造函数（`constructor`）属性，指向该函数自身。 3. 实例化与继承： - **实例化过程**：当使用`new`关键字创建函数的实例时，实例...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值