文档章节

prototype中顶层元素的测试

sucre
 sucre
发布于 2014/07/30 10:13
字数 431
阅读 6
收藏 0

  
  1. <html> 
  2.     <head> 
  3.         <title>顶层元素</title> 
  4.         <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
  5.         <script src="prototype.js"> 
  6.         </script> 
  7.         <script> 
  8.             var Person = Class.create(); 
  9.             Person.prototype = { 
  10.                 initialize: function(){ 
  11.                 }, 
  12.                 name: '', 
  13.                 birthday: '', 
  14.                 age: '', 
  15.                 Show: function(){ 
  16.                     alert("This is " + this.name); 
  17.                 } 
  18.             }; 
  19.             function TestPerson(){ 
  20.                 var p = new Person(); 
  21.                 p.name = "Tom"
  22.                 p.age = 4
  23.                 p.birthday = "1983-6-1"
  24.                 p.Show(); 
  25.             }; 
  26.             var User = Class.create(); 
  27.              
  28.             User.prototype = { 
  29.                 initialize: function(){ 
  30.                 }, 
  31.                 userid: '', 
  32.                 Report: function(){ 
  33.                     alert("UserID:" + this.userid + "   Name:" + this.name + "   Age:" + this.age + "  Birthday:" + this.birthday); 
  34.                 } 
  35.             }; 
  36.             Object.extend(User.prototype, Person.prototype); 
  37.             function TestUser(){ 
  38.                 var user = new User(); 
  39.                 user.name = "Jim"
  40.                 user.age = 4
  41.                 user.userid = 2396 
  42.                 user.birthday = "1983-9-1"
  43.                 user.Show(); 
  44.                 user.Report(); 
  45.                  
  46.             } 
  47.              
  48.             function ShowPrototypeInfo(){ 
  49.                 alert(Prototype.Version + "   " + Prototype.ScriptFragment); 
  50.             } 
  51.              
  52.             function TestInspect(){ 
  53.                 var s = "51cto"
  54.                 alert(Object.inspect(s)); 
  55.             } 
  56.              
  57.             //------------------------------------------------------- 
  58.             function testFunctionBind(){ 
  59.                 var person = new Person(); 
  60.                 person.name = "Charli"
  61.                 person.age = 4
  62.                 person.birthday = "1983-10-1"
  63.                 var user = new User(); 
  64.                 user.name = "Tom"
  65.                 user.age = 5
  66.                 user.userid = 2396 
  67.                 user.birthday = "1988-12-25"
  68.                 var handler = user.Report.bind(person); 
  69.                 handler(); 
  70.             } 
  71.              
  72.             var Listener = new Class.create(); 
  73.             Listener.prototype = { 
  74.                 initialize: function(btn, message){ 
  75.                  
  76.                     $(btn).onclick = this.showMessage.bindAsEventListener(message); 
  77.                 }, 
  78.                 showMessage: function(message){ 
  79.                     alert(message); 
  80.                 } 
  81.             }; 
  82.             var listener = new Listener("testEventListener", "点击!"); 
  83.         </script> 
  84.         <body> 
  85.             <input type=button value="ShowPrototypeInfo" onclick='return ShowPrototypeInfo();'/>显示Prototype的基本信息 
  86.             <br> 
  87.             <hr><input type=button value="TestPerson" onclick='return TestPerson();'/>利用我们创建的Person类生成一个p对象 检测一下是否成功 
  88.             <br> 
  89.             <input type=button value="TestUser" onclick='return TestUser();'/>User类继承Person类,生成一个User对象 检测一下是否成功 
  90.             <br> 
  91.             <input type=button value="TestInspect" onclick='return TestInspect();'/>测试一下Object的Inspect方法 
  92.             <br> 
  93.             <input type=button value="testFunctionBind" onclick='return testFunctionBind();'/>测试一下Object的FunctionBind方法 
  94.             <br> 
  95.             <input type=button value="testEventListener" id="testEventListener" />testEventListener 
  96.             <br> 
  97.             <script> 
  98.                 var Listener = new Class.create(); 
  99.                 Listener.prototype = { 
  100.                     initialize: function(btn, message){ 
  101.                         this.message = message; 
  102.                         $(btn).onclick = this.showMessage.bindAsEventListener(this); 
  103.                     }, 
  104.                     showMessage: function(){ 
  105.                         alert(this.message); 
  106.                     } 
  107.                 }; 
  108.                 var listener = new Listener("testEventListener", "点击!"); 
  109.             </script> 
  110.             <hr> 
  111.             <script> 
  112.                 function TimeExe(){ 
  113.                     var timerExe = new PeriodicalExecuter(showTime, 1); 
  114.                      
  115.                 } 
  116.                  
  117.                 function showTime(){ 
  118.                     var time = new Date(); 
  119.                     var d = $('myDiv'); 
  120.                     d.innerHTML = time
  121.                 } 
  122.             </script> 
  123.             <div id="myDiv"> 
  124.                 <p> 
  125.                     This is a paragraph 
  126.                 </p> 
  127.                 <input type="button" value=定时器测试 onclick="TimeExe();"> 
  128.                 <br> 
  129.             </div> 
  130.             <hr> 
  131.             <script> 
  132.                 function TestNumber(){ 
  133.                     var n = 50
  134.                     var b = 3
  135.                     alert(n.toColorPart()); 
  136.                     alert(n.succ()); 
  137.                     alert(b.toPaddedString()); 
  138.                     //b.times(alert()); 
  139.                 } 
  140.             </script> 
  141.             <input type="button" value='Number测试' onclick="return TestNumber();"/> 
  142.             <br> 
  143.         </body> 
  144.         </html> 

 

本文出自 “乔磊的博客 学习 进步” 博客,请务必保留此出处http://sucre.blog.51cto.com/1084905/413328

本文转载自:http://sucre.blog.51cto.com/1084905/413328

sucre
粉丝 33
博文 412
码字总数 214408
作品 0
高级程序员
私信 提问
ECMAScript5 用法总结

浏览器支持 现在虽然已经出了ES6的规范,但是各大浏览器兼容性还有待提高。所以现在我们平时写的js代码还是多以ES5为规范。时至今日,除了一些较低版本的浏览器,各大主流浏览器基本都实现了...

bothyan
2016/11/03
19
1
js常见基础对象属性方法(一)

js常见基础对象属性方法 Object.keys() Object.keys()方法会返回一个由一个给定对象的自身可枚举属性组成的数组,数组中属性名的排列顺序和使用 for...in 循环遍历改对象时返回的顺序一致(两...

孟飞阳
2018/07/17
122
0
白话原型和原型链

关于原型和原型链的介绍,网上数不胜数,但能讲清楚这两个概念的很少,大多数都是介绍各种对象、属性之间如何指来指去,最后的结果就是箭头满天飞,大脑一团糟。本文将从这两个概念的命名入手...

苍山沭河
2017/08/23
0
0
JavaScript原型到原型链

JavaScript原型到原型链 1. 每一个对象(null除外)都有proto属性 1. 构造函数的prototype 指向的是 实例对象的原型 1. constructor 实例和原型 原型的原型 补充...

何祯粮
03/10
12
0
数组与字符串方法

数组 1. 基本方法 1)Array.prototype.unshift(item1,item2,item3...) 描述: 在数组的前面添加元素,一次可以传入多个参数。 注意:元素会根据当前传入的顺序添加到数组的前面。 示例: va...

张涛泽
2017/04/19
0
0

没有更多内容

加载失败,请刷新页面

加载更多

分布式协调服务zookeeper

ps.本文为《从Paxos到Zookeeper 分布式一致性原理与实践》笔记之一 ZooKeeper ZooKeeper曾是Apache Hadoop的一个子项目,是一个典型的分布式数据一致性的解决方案,分布式应用程序可以基于它...

ls_cherish
今天
4
0
redis 学习2

网站 启动 服务端 启动redis 服务端 在redis 安装目录下 src 里面 ./redis-server & 可以指定 配置文件或者端口 客户端 在 redis 的安装目录里面的 src 里面 ./redis-cli 可以指定 指定 连接...

之渊
昨天
2
0
Spring boot 静态资源访问

0. 两个配置 spring.mvc.static-path-patternspring.resources.static-locations 1. application中需要先行的两个配置项 1.1 spring.mvc.static-path-pattern 这个配置项是告诉springboo......

moon888
昨天
4
0
hash slot(虚拟桶)

在分布式集群中,如何保证相同请求落到相同的机器上,并且后面的集群机器可以尽可能的均分请求,并且当扩容或down机的情况下能对原有集群影响最小。 round robin算法:是把数据mod后直接映射...

李朝强
昨天
4
0
Kafka 原理和实战

本文首发于 vivo互联网技术 微信公众号 https://mp.weixin.qq.com/s/bV8AhqAjQp4a_iXRfobkCQ 作者简介:郑志彬,毕业于华南理工大学计算机科学与技术(双语班)。先后从事过电子商务、开放平...

vivo互联网技术
昨天
24
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部