`

Prototype扩展Array,document,String,Function,Number

阅读更多

Array的扩展
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<title>扩展Array</title>
		<meta name="author" content="Yeeku.H.Lee" />
		<meta name="website" content="http://www.crazyit.org" />
		<meta http-equiv="Content-Type" content="text/html; charset=GBK" />
	</head>
	<body>
		<script src="js/prototype-1.6.0.3.js" type="text/javascript"></script>
		<script type="text/javascript">
			//定义第一个一维数组
			var a = [ 'Java', 'Java EE' ];
			//定义第二个一维数组
			var b = [ 'wawa', 'anno' ];
			//将两个一维数组组成一个二维数组
			var c = [ a, b ];
			c.each(function(ele, index) {
				document.writeln("第" + index + "个元素是:" + ele + "<br />");
			});
			//以一个二维数组和一个普通值形成三维数组
			var d = [ c, 'china' ]
			//输出三维数组的长度
			document.writeln("d数组的长度是:" + d.length + "<br />");
			//将三维数组"压扁"成一维数组。
			var e = d.flatten();
			//输出一维数组后的长度(看到5)和数组元素
			document.writeln(e.size() + e);
		</script>
	</body>
</html>
 document扩展:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<title>扩展document</title>
		<meta name="author" content="Yeeku.H.Lee" />
		<meta name="website" content="http://www.crazyit.org" />
		<meta http-equiv="Content-Type" content="text/html; charset=GBK" />
	</head>
	<body>
		<script src="js/prototype-1.6.0.3.js" type="text/javascript"></script>
		<script type="text/javascript">
		//为document的loaded事件绑定事件监听器
		document.observe("dom:loaded" , function(event)
		{
			$("show").innerHTML += ("页面装载完成 <br />");
		});
		//为document的a:b事件绑定事件监听器
		document.observe("a:b" , function(event)
		{
			$("show").innerHTML += ("myEvent被触发了 <br />");
			//访问event.memo.book属性
			$("show").innerHTML += ("event.memo.book属性值为:" 
				+ event.memo.book);
		});
		</script>
		<!-- 单击该按钮时触发document上的a:b事件 -->
		<input type="button" value="单击我"
			onclick='document.fire("a:b" , {book:"Ajax"});' />
		<div id="show"></div>
	</body>
</html>
 String扩展:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<title>扩展document</title>
		<meta name="author" content="Yeeku.H.Lee" />
		<meta name="website" content="http://www.crazyit.org" />
		<meta http-equiv="Content-Type" content="text/html; charset=GBK" />
	</head>
	<body>
		<script src="js/prototype-1.6.0.3.js" type="text/javascript"></script>
				<script type="text/javascript">
			//用于示范删除XML和HTML标记
			var str1 = '<a>dfd</a>';
			//输出结果为dfd
			alert("'<a>dfd</a>'.stripTags()的结果为:" + str1.stripTags());
			//用于示范删除脚本
			var str2 = '<script>dfd<\/script>';
			//删除脚本后字符串为空字符串
			alert("'<script>dfd<\/script>'.stripScripts()的结果为:" + str2.stripScripts());
			//示范将HTML标记转义
			var str3 = '<a>dfd</a>';
			//输出结果为&lt;a&gt;dfd&lt;/a&gt;
			alert("'<a>dfd</a>'.escapeHTML()的结果为:" + str3.unescapeHTML());
			//示范反转义HTML标记
			var str4 = '&lt;a&gt;dfd&lt;/a&gt;';
			//输出结果为<a>dfd</a>
			alert("'&lt;a&gt;dfd&lt;/a&gt;'.unescapeHTML()的结果为:" + str4.unescapeHTML());
			//示范执行字符串中的脚本
			var str5 = '<script>alert("====");<\/script>';
			//弹出警告对话框
			str5.evalScripts();
			//示范取得字符串中的脚本
			var str6 = '<script>alert("====");<\/script>' + '<script>alert("xxxx");<\/script>';
			//输出一个长度为2的字符串数组。
			alert(str6.extractScripts());
			var str7 = 'abc-xyz-ghi';
			var str8 = str7.camelize();
			alert("'abc-xyz-ghi'.camelize()的值为:" + str8);
			var str9 = str8.underscore().dasherize();
			//再次恢复'abc-xyz-ghi';
			alert(str9);
			var book = 'Java EE';
			alert("'Java EE'.truncate(8 , '...')的值:"
					+ book.truncate(10, '...'));
			var str10 = 'java struts hibernate';
			//用逗号(,)替换空白,将输出java,struts,hibernate
			alert(str10.gsub('\\s+', ','));
			//使用自定义替换,将所有单词首字母大写,并在单词后添加逗号(,)
			//将输出Java, Struts, Hibernate
			alert(str10.gsub('\\w+', function(match) {
				return match[0].capitalize() + ",";
			}));
			//将依次输出java,struts,hibernate
			str10.scan("\\w+", function(match) {
				alert(match);
			});
		</script>
	</body>
</html>
 Function扩展:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<title>扩展Function</title>
		<meta name="author" content="Yeeku.H.Lee" />
		<meta name="website" content="http://www.crazyit.org" />
		<meta http-equiv="Content-Type" content="text/html; charset=GBK" />
	</head>
	<body>
		<script src="js/prototype-1.6.0.3.js" type="text/javascript"></script>
		<script type="text/javascript">
			//定义一个JavaScript对象
			var person = {
				name : 'lbx',
				//虽然info()函数定义在person对象里,它依然是一个独立的函数
				info : function() {
					alert(this.name);
				}
			};
			//看到输出'yeeku'
			person.info();
			//再定义一个runFn函数,该函数专门用于运行指定函数
			function runFn(f) {
				f();
			}
			window.name = 'Java';
			//该函数所在范围是window,所以this.name为'Java讲义'
			runFn(person.info);
			//下面代码先将person.info函数绑定给person。
			//这样无论以何种方式执行该函数,person.info函数的this总是引用person。
			runFn(person.info.bind(person));
			function test(name, age) {
				alert("此人名为:" + name + "\n" + "年龄为:" + age);
			}
			//将test()函数包转成newTest函数,test()函数的第一个参数已经有值
			var newTest = test.curry('lbx');
			//将输出"此人名为:lbx\n 年龄为:31
			newTest(31);
			//定义一个函数,函数targe
			var fn1 = function(target, name) {
				target.name = name;
			};
			//执行fn1.methodize();产生一个新函数
			var fn2 = fn1.methodize();
			//程序将this(代表window)传入fn1。
			fn2("XML");
			//输出"XML"
			alert(name);
		</script>
	</body>
</html>
 Number扩展:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<title>扩展Number</title>
		<meta name="author" content="Yeeku.H.Lee" />
		<meta name="website" content="http://www.crazyit.org" />
		<meta http-equiv="Content-Type" content="text/html; charset=GBK" />
	</head>
	<body>
		<script src="js/prototype-1.6.0.3.js" type="text/javascript"></script>
		<script type="text/javascript">
			//下面输出4。
			alert((-4).abs());
			//下面输出-2。
			alert((-2.3).ceil());
			//下面输出-2。
			alert((-1.4).floor());
			//下面输出4。
			alert((4.4).round());
			//下面输出2.2。
			alert((1.2).succ());
			//下面将依次输出0、1、2
			(3).times(function(num) {
				alert(num);
			});
			//下面将输出'13'
			alert((19).toColorPart());
			//下面将输出'000022'
			alert((12).toPaddedString(6, 5));
		</script>
	</body>
</html>
 

分享到:
评论

相关推荐

    prototype.js开发笔记.pdf

    Prototype.js提供了许多JavaScript类的扩展,例如Object、Number、Function、String、Document、Event等。 2.2. 对 Object 类的扩展 Prototype.js提供了许多Object类的扩展,例如Object.extend()、Object.clone()...

    prototype开发笔记.doc

    它包括对JavaScript核心类型和对象的扩展,如Array、String、Function、Number等,并且引入了一些新的概念,如类(Class)和模块(Module)机制,以及强大的DOM操作工具。 1.2. 关联文章 "高级JavaScript指南"可能...

    prototype.js开发者手册.doc

    它还扩展了JavaScript的基本类型,例如Array、String、Number等,添加了新的方法和属性。 3. **Ajax支持**: Prototype.js 提供了强大的Ajax工具集,包括`Ajax.Request`和`Ajax.Updater`等,用于创建异步HTTP请求...

    prototype介绍和使用方法

    - Prototype对JavaScript的基本类型如Object、Number、Function、String等进行了扩展,添加了新的方法。 - 对document DOM对象和Event对象进行了增强,如Element对象提供了许多方便的DOM操作方法。 - 引入了新的...

    prototype.js 说明文档.doc

    对JavaScript的`Object`、`Number`、`Function`、`String`、`document DOM`对象、`Event`对象以及各种自定义对象和类的扩展。 2.30. 至2.36. 还包括定时执行器、事件观察者等高级功能,如`Abstract.TimedObserver`...

    精通prototype开发Ajax应用

    Prototype扩展了JavaScript的很多内置对象,如Object、Number、Function、String等,并且增强了对DOM操作和事件处理的支持。此外,它还定义了一些新的对象和类,如Ajax对象、Element对象等,用于处理Ajax交互和DOM...

    prototype开发笔记

    - 对String类的扩展,如`String.prototype.endsWith()`判断字符串是否以指定字符结束。 - 对document DOM对象的扩展,如`Element`对象用于操作DOM元素。 - 对Event对象的扩展,增强事件处理能力。 除此之外,...

    AJAX之Prototype入门学习.docx

    - Prototype 对 Object、Number、Function、String、Array、Event 等原生对象进行了扩展,添加了诸如 `each()`, `any()`, `collect()` 等方法,提高了代码的可读性和效率。 3. **Ajax 支持**: - `Ajax.Request` ...

    Developer Notes for prototype.doc

    Prototype 扩展了多个核心 JavaScript 类,包括 Object、Number、Function、String、Array 等,提供了额外的方法和功能。 - **Object**: 添加了 `extend`、`keys` 等方法。 - **Number**: 添加了 `round`、`abs` 等...

    prototype 中文教程PDF

    - **5.1.4 对 String 的扩展** - **5.1.5 对 Array 的扩展** 这些扩展提供了额外的方法来增强 JavaScript 内置类型的实用性。 ##### 5.2 document DOM 扩展 - **功能描述**:`document` 对象的扩展包括了 `$`, `$...

    prototype手册

    • Extensions for the Number class • Extensions for the Function class • Extensions for the String class • Extensions for the Array class • Extensions for the document DOM object • ...

    prototype开发文档

    Prototype 对原生 JavaScript 类型进行了扩展,如 `Object`、`Number`、`Function`、`String`、`Event`,以及对 `document` 和 `Element` 等DOM对象的增强。这些扩展提供了更多的实用方法和功能。 - **Object....

    prototype 中文API

    `prototype.js` 扩展了多个原生JavaScript对象,包括`Object`, `Number`, `Function`, `String`, `Array`等,增强了它们的功能,例如添加了额外的属性和方法。 ##### 5.2 document DOM扩展 DOM操作是Web开发中的...

    prototype1.4中文手册

    - **对 String 的扩展**:添加了 `interpolate`, `traverse`, `gsub`, `gsub!`, `split`, `camelize`, `capitalize`, `underscore`, `truncate`, `strip`, `stripTags`, `escapeHTML`, `unescapeHTML`, `...

    javascript学习总结.pdf

    Array.prototype.first = function() { return this[0]; }; var arr = [1, 2, 3]; console.log(arr.first()); // 输出 1 ``` 总之,JavaScript是一门强大的脚本语言,深入理解其对象系统、DOM操作、函数和...

    jquery需要的所有js文件

    widgetEventPrefix:a[e][b].prototype.widgetEventPrefix||b,widgetBaseClass:f},d),a.widget.bridge(b,a[e][b])},a.widget.bridge=function(c,d){a.fn[c]=function(e){var f=typeof e=="string",g=Array.prototype....

    mootools1.11中文文档

    6. **工具函数**:Utils模块提供了一系列实用的辅助函数,如Array、String、Number等对象的扩展方法,提高代码的可读性和效率。 7. **类系统**:MooTools采用面向对象的编程模型,通过Class和Function.prototype....

    前端Javascript相关面试基础问答整理md

    - 包括简单数据类型:`undefined`、`null`、`boolean`、`number`、`string`、`symbol`。 - 这些值直接存储在变量所在的栈内存中。 - 当将一个原始类型的值赋给另一个变量时,实际上是复制了该值。 **引用类型...

    Javascript 常用代码总结

    可能的返回值有:"number", "string", "boolean", "object", "function", "undefined"。 #### 6. 文件操作与图像加载 - **文件大小**:可以通过以下方式获取文件大小(假设页面中有一个`&lt;input type="file"&gt;`): ...

    JavaScript手册

    除了这些基础对象,JavaScript还提供了Array、Date、Function等对象,以及DOM对象,如Element、Document等,使得开发者能够处理数组、日期、函数以及与网页交互的各种任务。 在JavaScript中,创建自定义对象通常...

Global site tag (gtag.js) - Google Analytics