JavaScript 的方法重载效果_javascript技巧

在 JavaScript 的方法内,有个叫做 arguments 的变量数组,它是只读的,所有实际传入的参数变量都
放在了里面,通过它,我们可以对传入的参数进行类型检查,从而实现重载的效果。
判断一个变量的类型有两种方法。
1,用 typeof 语句:

复制代码 代码如下:

function check(){
if(typeof arguments[0] == 'string')
alert('你传入的参数是个字符串');
else if(typeof arguments[0] == 'number')
alert('你传入的参数是个数字');
}

2,用所有 JavaScript 变量都带有的一个属性 constructor,这个属性指向用来构造该变量的构造函数:

复制代码 代码如下:

function check(){
if(arguments[0].constructor == String)
alert('你传入的参数是个字符串');
else if(arguments[0].constructor == Number)
alert('你传入的参数是个数字');
}

对照表:
typeof constructor
---------------------------
string String
number Number
object Object
function Function
boolean Boolean
object Array
object User
通过这个对照表可以看出用 typeof 不能准确的判断出具体的类型,所以我们用 constructor 来进行判
断。
首先我们定义一个用来判断参数类型和个数的方法

复制代码 代码如下:

function checkArgs(types,args){
// 检查参数个数
if(types.length != args.length){
return false;
}
// 检查参数类型
for(var i=0; i<args.length; i++){
if(args[i].constructor != types[i]){
return false;
}
}
return true;
}

我们定义一个方法对上面的方法进行应用

复制代码 代码如下:

function show(){
// 处理参数是一个字符串的调用
if(checkArgs([String],arguments)){
alert(arguments[0]);
}
// 处理参数是一个字符串和一个数字的调用
else if(checkArgs([String,Number],arguments)){
var s = '';
for(var i=0; i<arguments[1]; i++){
s+=arguments[0];
}
alert(s);
// 参数不符合要求时,给予提示
}else{
alert('不支持的参数');
}
}

当我们定义的 JavaScript 方法对参数要求比较严格时,就可以用这样的方式来编写代码。

时间: 2024-09-23 17:40:41

JavaScript 的方法重载效果_javascript技巧的相关文章

JavaScript中的方法重载实例_javascript技巧

.NET里面的方法重载用着的确很方便,哪Javascript里面能不能也哪样做呢? Javasciprt里面本生是没有方法重载的功能,以前很多人的做法可能是直接少传参数过去,然后在根据参数是否为 "undefined" 未定义来决定怎么处理,从而实现类似方法重载的功能. 例如: 复制代码 代码如下: var showMessage = function(name,value,id){     if(id != "undefined"){         alert(

JS模拟实现方法重载示例_javascript技巧

本文实例讲述了JS模拟实现方法重载.分享给大家供大家参考,具体如下: 在JS方法中,不能像C#方法能实现重载,但是我们可以通过js中的arguments来实现js方法的重载. 下面给出html实例: <html> <head> <title>JS方法的重载</title> <script> function testFun1(arm1){ /// <summary> /// JS重载测试被调用方法1 /// </summary&

JavaScript实现窗口抖动效果_javascript技巧

原理介绍 抖动其实是往复运动的一种特殊形式,只不过往复运动是一种无摩擦力的无限运动,且以速度为参照依据:而抖动以位置作为参照依据,最终停在起始点 在网页中最常见的一种抖动效果应该是窗口抖动提示了 抖动元素从起始点开始,先向右移动最大距离len,然后移动到对称的左边位置:然后再向右移动稍微小一点的距离,再移动到对称的左边位置:以此循环,最终元素停止在起始点 代码实现 抖动在代码实现上,无非就是通过定时器,每隔一段时间让left或top值进行变化 在运动实现中,有两种距离变化的思路 思路一 div.

基于javascript实现窗口抖动效果_javascript技巧

本文实例讲解了基于javascript实现窗口抖动效果的详细代码,分享给大家供大家参考,具体内容如下 效果图: 鼠标点击,窗口实现抖动. 具体代码: <!DOCTYPE HTML> <html> <head> <meta charset="gb2312"/> <title>窗口登陆效果</title> <style type="text/css"> #win { position:r

javascript简单实现命名空间效果_javascript技巧

Javascript原生并不支持命名空间,需要变通来实现. 在我们创建一个JavaScript库时,命名空间就显得举足轻重了,我们可以将组成这个JavaScript库的零散的JavaScript文件(*.js)封装在命名空间中,而无须定义全局的函数或类.比如在本章节多次出现的Person,我们就可以作为库的一部分封装到合适的命名空间中: Code 5-13: 复制代码 代码如下: var com = {};com.anyjava = {};com.anyjava.Person = functio

基于JavaScript实现TAB标签效果_javascript技巧

 js实现tab标签效果,在项目中经常用到,今天抽点时间把我写的js实现tab标签效果源码分享给大家,对js tab标签代码需要的朋友参考下 废话不多说了,直接给大家贴代码了: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <meta name="keywords" content=

基于javascript实现图片滑动效果_javascript技巧

今天看了别人写的图片滑动,看起来很酷,读源码时,似乎有些困难,就模仿着写了一个,实现的效果与原网页相同,不过自己的js代码,逻辑简单,有待改进. ps:前两天写了旋转木马,那个兼容性不好,今天写这个网页的时候,也是按照这个思路,在谷歌浏览器上运行很好,火狐很多功能不能实现,由于wrap--panel使用了绝对定位,就将translate平移改为了left.改动后,各个浏览器运行的效果不错. 具体代码如下 html代码(没写注释) <div class="container">

JavaScript实现广告弹窗效果_javascript技巧

大家都见过某度中的恶意广告,你关闭了又出来了!为何,JS来告诉你 HTML  <body> <h3 class="whiteColor">无法关闭的弹框,打不死的小强!</h3> <div id="middleBox"> <a href="javascript:;" class="close_btn" id="closeBtn"><img s

JavaScript数组方法总结分析_javascript技巧

由于最近都在freecodecamp上刷代码,运用了很多JavaScript数组的方法,因此做了一份关于JavaScript教程的整理,具体内容如下: 一.普通方法 1.join() 将数组元素连接在一起,并以字符串形式返回 参数:可选,指定元素之间的分隔符,没有参数则默认为逗号 返回值:字符串 对原数组的影响:无 2.reverse()将数组的元素顺序变成倒序返回 参数:无 返回值:数组 对原数组的影响:原数组被修改为倒序排列之后的数组 3.sort()对数组元素进行排序并返回 参数:可选,排