首页 / JAVASCRIPT / 总结两个Javascript的哈稀对象的一些编程技巧

总结两个Javascript的哈稀对象的一些编程技巧

内容导读

互联网集市收集整理的这篇技术教程文章主要介绍了总结两个Javascript的哈稀对象的一些编程技巧，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含4378字，纯文字阅读大概需要7分钟。

内容图文

我喜欢从最基础的内容讲起，然后慢慢深入，高手可能要给点耐心啊。
先看一个最简单的应用。在下面的代码中，我们需要实现一个功能，就是点击每个按钮显示相应的网址
代码如下:
<input type="button" value="百度" onclick="javascript:showUrl(this)"> 
<input type="button" value="Google" onclick="javascript:showUrl(this)"> 
<input type="button" value="微软" onclick="javascript:showUrl(this)"> 
<input type="button" value="博客园" onclick="javascript:showUrl(this)"> 
<input type="button" value="阿舜的博客" onclick="javascript:showUrl(this)">那么。怎么写这个 showUrl函数呢? 我想大多数人可能会这样写. 
<script type="text/javascript"> 
// by Go_Rush(阿舜)  from http://ashun.cnblogs.com/ 
function showUrl(element){ 
    var url; 
    switch (element.value){ 
        case "百度":          url="http://www.baidu.com/"    ;break; 
        case "Google":         url="http://www.google.com/"    ;break; 
        case "微软":          url="http://www.microsoft.com/";break; 
        case "博客园":          url="http://www.cnblogs.com/"    ;break; 
        case "阿舜的博客":  url="http://ashun.cmblogs.com/" ;break; 
        default:             url="" 
    } 
    alert(url) 
} 
</script>

这样写不太好，原因有二:
1.写太长，很麻烦，用if, switch 语句来写,如果有100个条件，那岂不要写100个语句
2.不便于维护和扩展，如果需求经常变化，那些数据从数据库来怎么办，每变一下都要改程序的逻辑结构
对JavaScript比较有经验的程序员肯定不会这样写，一般用数组来实现。 可以是二维数组，也可以是双数组
1.双数组方法
代码如下:
<script type="text/javascript"> 
// by Go_Rush(阿舜)  from http://ashun.cnblogs.com/ 
var arrText=["百度","Google","微软","博客园","阿舜的博客"]; 
var arrUrl=["http://www.baidu.com/","http://www.google.com/","http://www.microsoft.com/","http://www.cnblogs.com/","http://ashun.cmblogs.com/"] 
function showUrl(element){    //用双数组方法 
    var value=element.value; 
    for(var i=0;i<arrText.length;i++){ 
        if (arrText[i]===value) return alert(arrUrl[i]) 
    } 
} 
</script> 

2. 二维数组方法
代码如下:
<script type="text/javascript"> 
// by Go_Rush(阿舜)  from http://ashun.cnblogs.com/ 
var arr=[ 
    ["百度"            ,"http://www.baidu.com/"], 
    ["Google"        ,"http://www.google.com/"], 
    ["微软"            ,"http://www.microsoft.com/"], 
    ["博客园"        ,"http://www.cnblogs.com/"], 
    ["阿舜的博客"    ,"http://ashun.cmblogs.com/"] 
]； 
function showUrl(element){    //用二维数组方法 
    var value=element.value; 
    for(var i=0;i<arr.length;i++){ 
        if (arr[i][0]===value) return alert(arr[i][1]) 
    } 
} 
</script> 

以上两种方法借用数组作为数据结构，实现了程序要求的功能，而且为以后的扩展，变动做好了充分的准备
但是，效率呢？ 每次都要遍历数组，每次都要判断。。。。
下面，我来介绍一种不用数组，不用循环遍历，也不要判断比较的方法。
先来一段：
代码如下:
<script type="text/javascript"> 
// by Go_Rush(阿舜)  from http://ashun.cnblogs.com/ 
var hash={ 
    "百度"            :"http://www.baidu.com/", 
    "Google"        :"http://www.google.com/", 
    "微软"            :"http://www.microsoft.com/", 
    "博客园"        :"http://www.cnblogs.com/", 
    "阿舜的博客"    :"http://ashun.cmblogs.com/" 
}; 
function showUrl(element){    //使用哈稀对象 
    alert(hash[element.value]) 
} 
</script> 

看到没有，以前要用循环的，要用判断的函数，现在只要一行代码就OK了，而且扩展性还是最好的。
如果您对JavaScript比较熟悉，您一定会对数组情有独钟，因为它确实是一种非常方便，应用非常广泛的
数据结构，但是对于哈稀对象这个青苹果，哪怕您只啃过它一口，你一定永远不会忘记它的甜美。
他作为一种数据结构，在许多场合可以简化编程，在海量数据面前，他的性能要远远高于数组。(这个在
我日后的po文里面会提到的，请关注)
他作为一种对象，可以在JavaScript实现类，模拟面向对象编程。
 以上讲得非常简单，仅作为抛砖引入，大家有兴趣的可以在回复里面谈谈自己的应用心得啊。
临走之前再讲个例子－－－－判断上传的文件是否为图像文件.

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]请注意那个set函数，当我们实现这个函数后，就可以像python一样使用集合对象了，是不是很方便呢 

内容总结

以上是互联网集市为您收集整理的总结两个Javascript的哈稀对象的一些编程技巧全部内容，希望文章能够帮你解决总结两个Javascript的哈稀对象的一些编程技巧所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。

内容备注

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。

内容手机端

扫描二维码推送至手机访问。

本文链接：https://qyyshop.com/info/375380.html

来源：【匿名】