javascript是一门灵活的脚本语言,是一种轻型的解释型的程序设计语言.因此js被作为嵌入式脚本语言使用,这也使它具有巨大的灵活性。
例,使用不同的方法设计IO接口对象。
//实现一 过程化设计
function set(x) {
this.x = x;
}
function get() {
return this.x;
}
//这种做法很简单但是无法有效地保存操作的数据和状态。
//实现二 定义原型方法
//为以上两个函数定义一个类,把这两个函数绑定到类的原型对象上,如果需要使用他们,只需要创建类的实例,调用实例对象的方法即可。
//这样就将函数有机地整合到类结构中,避免了过程化设计的松散。
var Box = function() {} //定义类
Box.prototype.set = function(x) { //定义类的原型方法
this.x = x;
}
Box.prototype.get = function() {
return this.x;
}
var box = new Box(); //创建实例对象
box.set(10);
var a = box.get();
alert(a);
//什么是原型和原型方法?简单地说就是对象的公共方法。
//实现三 封装原型方法
var Box = function() {}
Box.prototype = {
set: function(x) {
this.x = x;
},
get: function() {
return this.x;
}
}
//实现四 造车不如设计标准
//为Function类定义原型方法,自然这个方法为所有函数所用,包括构造函数。
//这个原型方法能够根据传入的名称和函数实现,把函数封装成指定名称的方法,并把方法绑定到指定的构造函数(即类)上。
var Box = function() {}
Box.prototype.construtor.construtor.prototype.make = function(n, f) {
this.prototype[n] = f;
}
Box.make("set", function(x) {
this.x = x;
})
Box.make("get", function{} {
return this.x;
})
//以上实现方法用更明白的表现方式如下
Function.prototype.make = function(n, f) { //为Funtion类定义原型方法,这个方法用于为函数类制造方法
this.prototype[n] = f;
}
var Box = function() {} //定义类
//为类制造方法
Box.make("set", function(x) {
this.x = x;
})
Box.make("get", function(){
return this.x;
})
//这样就明白了,Box.prototype.construtor.construtor指的就是Function类。
//以上实例演示了如何为Function类定义原型方法,该方法接受两个参数,第一个参数是字符串代表方法名称,第二个参数是函数体,定义了方法的具体实现。
//实现五 方法接龙
//如果为原型方法make()中添加一行代码 return this; 那么整个程序变得惊心动魄。
Function.prototype.make = funciton(n, f){
this.prototype[n] = f;
return this;
}
var Box = function() {}
Box.make("set", function(x) {
this.x = x;
}).make("get", function() {
return this.x;
}).make("add", function() {
return this.x + this.x;
})
分享到:
相关推荐
<TITLE>诗词学习</TITLE> </HEAD> <BODY> <P>我是第一段</P> <P>我是第二段</P> <P align="left">左对齐显示<P> <P align="center">居中显示<P> <P align="right">右对齐显示<P> </BODY> </HTML> <HEAD> <SCRIPT ...
<script src="./js/vue%20(1).js" type="text/javascript" charset="UTF-8"></script> src里面的内容根据自己的下载的Vue.js的文件位置决定的,我这里只是拿我自己做的举个例子。这个地方的vue.js是因为我下载了两次...
第一课 <br> Javascript教程 <br> 课程简介 <br> 实际应用 <br> 隐藏JavaScript <br> 第一天复习 <br> 第二课 <br> 第二天课程简介 <br> 变量介绍 <br> 首个变量例子的程序主体 <br> 字符串的魔力 <br> 变量练习 <br...
">1</a> </li> <li> <a href="javascript:;">2</a> </li> <li> <a href="javascript:;">3</a> </li> <li> <a href="javascript:;">4</a> </li> <li> <a href=...
<br>系统设计<br> 1 jive设计思路 <br> 2 jive的工作内幕 <br> 3 Jive源代码研究 <br> 4 Jive中的设计模式 <br> 5 jive学习笔记 <br><br><br> <br>设计模式<br> 1 大道至简-Java之23种模式一点就通 <br> 2 设计模式...
<div class="djs"> <p>元旦倒计时:</p> ... <span class="hour">1</span> <span>小时</span> <span class="minute">2</span> <span>分</span> <span class="second">3</span> <span>秒</span> </div> </div>
绝对的经典javascript收藏 包含了各个种类的js校验实例<br>web开发绝妙帮手<br><br>javascript收藏 <br>1.页面校验 <br>1.文本框约束输入 <br>2.表单校验工具库 <br>3.文本框部分内容不让改变 <br>2.下拉框类 <br>...
<script language="JavaScript">var when=new Date(); document.write("<h4>"); document.write(when.getYear()+"年"); document.write((when.getMonth()+1)+"月"); document.write(when.getDate()+...
DOCTYPE html> <html> <head><title>贪吃蛇</title> </head> <body> <canvas id="canvas" width="400" height="400"></canvas> <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></...
<br><script language=javascript src="images/date.js"></script><br><br>2、在input上,加上得到焦点事件:<br><input name="textfield1" type="text" size="16" onfocus="javascript:setday(this)"><br><br><br>3...
方便初学者,借鉴学习javascript语言
-(4)<br>JavaScript面向对象的支持--(5)<br>JavaScript面向对象的支持--(6)<br>JavaScript精简学习1:基础知识<br>JavaScript精简学习2:浏览器输出<br>JavaScript精简学习3:图像<br>JavaScript精简学习4:表单<br>...
<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script> <script type="text/javascript" src="js/jquery-ui-1.8.17.custom.min.js"></script> <script type="text/javascript" src="js/jquery-...
<br><br>调用方式:<br>用动态Web语言在HTML界面上输出如下代码:<br><br><br><br><br>引用:<br><br><br><script language="javascript"> <br> <br> pager = new PageNavigater(20, 1000000, 243, "right", ...
<script type="text/javascript" src="calendar.js"></script> </head> <script language=javascript> function aa() { document.getElementById('Calendar1').focus(); setday(document....
我已经把第一学期所有的课件打包在一起了,一共有5部分,这是第一部分<br><br>大家载时要记得评分,这样你们就不要资源分了<br><br>C语言<br><br>HTML && JavaScript 电子档课件ppt.rar<br><br>java&&OOP <br><br>SQL...
HTML+CSS+JavaScript教程学习笔记HTML+CSS+JavaScript教程学习笔记 HTML+CSS+JavaScript教程学习笔记HTML+CSS+JavaScript教程学习笔记 HTML+CSS+JavaScript教程学习笔记HTML+CSS+JavaScript教程学习笔记 ...
配图列表<br>列表 <br>1 说明<br>1.1 主要的内容<br>1.2 学习目标 <br>2 了解JavaScript 浏览器上的程序语言 <br>2.1 JavaScript 操作对象的简单介绍-- 属性和方法<br>2.2 JavaScript 代码的加入 <br>2.2.1 加入...
javascript 模拟 java中的 List,Map<br>js文件为 js/utils.js<br>IE6.0 测试通过<br><br>List:<br>add(var obj) //添加一个元素<br>remove(var index) //删除一个元素<br>get(var index) //获取一个元素<br>remove...
<html> <head> <tilie>呼呼哈嘿的网页弹球</title> </head> <body> <canvas id="canvas"width="400"height="400"></canvas> <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></...