js常用代码段整理


Posted in Javascript onNovember 30, 2011

每段代码前边都有功能注解和参数要求等说明文字,难度不大也就没做更多注释。 为看得清楚,这里依先后顺序做个小目录:
重写window.setTimeout,
理解递归程序的返回规律,
截取长字符串,
取得元素在页面中的绝对位置,
统计、去除重复字符(多种方法实现),
把有序的数组元素随机打乱(多种方法实现)。

/* 
功能:修改 window.setTimeout,使之可以传递参数和对象参数 (同样可用于setInterval) 
使用方法: setTimeout(回调函数,时间,参数1,...,参数n) (FF已经原生支持,IE不支持) 
*/ 
var __sto = setTimeout; 
window.setTimeout = function(callback,timeout,param){ 
var args = Array.prototype.slice.call(arguments,2); 
var _cb = function(){ 
callback.apply(null,args); 
} 
__sto(_cb,timeout); 
} 
function aaaaa(a,b,c){ 
alert(a + b + c); 
} 
window.setTimeout(aaaaa,2000,5,6,7); /**//* 
功能:理解递归程序的返回规律(从内到外) 
对象之间成员的互引用 
*/ 
var ninja = { 
yell: function(n){ 
return n > 0 ? ninja.yell(n-1) + "a" : "hiy"; 
} 
}; 
alert(ninja.yell(4))//结果为:hiyaaaa; 
var samurai = { yell: ninja.yell }; 
//var ninja = {}; // 此处 注释与否 对结果有影响 
try { 
alert(samurai.yell(4)); 
} catch(e){ 
alert("Uh, this isn't good! Where'd ninja.yell go?" ); 
} /** 功能:截取长字符串 
* @param {string} str 要截取的字符串 
* @param {number} size 截取长度(单字节长度) 
*/ 
var subStr = function(str, size){ 
var curSize = 0, arr = []; 
for(var i = 0, len = str.length; i < len; i++){ 
arr.push(str.charAt(i)); 
if (str.charCodeAt(i) > 255){ 
curSize += 2; 
if(size === curSize || size === curSize - 1){ 
return arr.join(''); 
} 
}else{ 
curSize++; 
if(size === curSize){ 
return arr.join(''); 
} 
} 
} 
}; 
var str = '#%*……&#什么东西1234abcd 还不够长'; 
alert(str.length); 
alert(str.substr(0, 15)); 
alert(subStr(str, 15));/**//* 
功能:取得元素在页面中的绝对位置(相对于页面左上角) 
@param {string} node 待求位置的DOM元素 
*/ 
function getAbsPosition(node) { 
var t = node.offsetTop; 
var l = node.offsetLeft; 
while (node = node.offsetParent) { 
t += node.offsetTop; 
l += node.offsetLeft; 
} 
alert("top=" + t + "\n" + "left=" + l); 
}/**//* 
功能:统计、去除重复字符 
@param str 需要统计的字符串 
说明:常用于字符串中重复字符,或者数组中重复的字母、数字等个数统计。 
此处从网上收集两种典型的类型,分别有两种实现方法,其他还有许多变种,从不同角度编写,可搜索学习。 待统计的数据,不论是数组和字符串都可以,只用借助String.split()或 Array.join() 
转换为函数参数要求的类型即可。 
*/ // 类型一:借助新建对象来保存数据 
var count1 = function (str) { 
var map = {}, maxCount = 0, maxChar, undefined, i = str.length; 
while (i--) { 
var t = str.charAt(i); 
map[t] == undefined ? map[t] = 1 : map[t] += 1; 
if (map[t] > maxCount) { 
maxChar = t; 
maxCount = map[maxChar]; 
} 
} 
return "字符:" + maxChar + "次数:" + maxCount; 
}function s_0(a) { // 此处参数应为数组类型 
var b = {}, c = [], i; 
for (i = 0; i < a.length; i++){ 
if (!b[a[i]]) { 
c[c.length] = a[i], b[a[i]] = true; 
} 
} 
return c; 
}// 类型二:正则表达式匹配统计 
var count2 = function (str) { 
var most = str.split('').sort().join('').match(/(.)\1*/g); //排列重复字符 
most = most.sort(function (a, b) { return a.length - b.length }).pop(); //按出现频繁排序 
return most.length + ': ' + most[0]; 
}function s_1(a) { 
var a = a.join(""), b = []; 
while (a.length > 0) 
a = a.replace(new RegExp((b[b.length] = a.charAt(0)), "g"), ""); 
return b; 
}/**//* 
功能:把有序数组打乱(产生无序随机数组) 
说明:基本的排序算法大家应该都很清楚。但是在编程中也经常用到相反的操作,即把原来有序的数组元素随机打乱。 
以下给出三种方法,第一种是以前我自己写出来的,由于水平差,写出的代码时间复杂度太大, 
于是从网上搜索一些简单而且效率高的方法来。 
第二种据说是“洗牌算法”,想必很多人都听说过; 
第三种是利用JS的内置sort方法,这种实现起来很简单。 
*/ 
// 方法1(给大家做失败的教训借鉴) 
function randArray(num) { 
var rands = []; 
var ra = parseInt(num * Math.random()); 
rands.push(ra); 
for (var r = 0; r < num - 1; r++) { 
ra = parseInt(num * Math.random()); 
for (var m = 0; m < rands.length; m++) { 
while (rands[m] == ra) { 
ra = parseInt(num * Math.random()); 
m = -1; 
} 
} 
rands.push(ra); 
} 
//alert(rands); 
return rands; 
} 
// 方法2: 
//选择两个[0...array.Length)之间的随机数,把它们做下标的两个元素交换位置(这样乱序效率高) 
/* 说明:这是“洗牌算法” 有人证明打乱的效果如下: 
随机交换nums/2次的效果很差,平均约1/3的对象还在原来的位置 
随机交换nums次才基本可用,平均约15%的对象还在原来的位置 
随机交换nums*2次才真正可用,平均约2%的对象还在原来的位置 
*/ 
function daluan(nums) { 
var array=[]; 
for (var i = 0; i < nums; i++) { 
array[i] = i; 
} 
for (var i = 0; i < nums; i++) { 
var rand = parseInt(nums * Math.random()); 
var temp = array[i]; 
array[i] = array[rand]; 
array[rand] = temp; 
} 
return array; 
} 
// 方法3: 
// 让比较函数随机传回-1或1就可以了(这样乱序效率可能不高) 
var testArray3=[1,2,3,4,5,6,7,8,9,10,22,33,55,77,88,99]; 
testArray3.sort(function(){return Math.random()>0.5?-1:1;}); 
alert(testArray3);
Javascript 相关文章推荐
浅析tr的隐藏和显示问题
Mar 05 Javascript
JavaScript动态添加列的方法
Mar 25 Javascript
Jquery效果大全之制作电脑健康体检得分特效附源码下载
Nov 02 Javascript
jQuery基于正则表达式的表单验证功能示例
Jan 21 Javascript
使用JavaScript实现链表的数据结构的代码
Aug 02 Javascript
AngularJS实现的简单拖拽功能示例
Jan 02 Javascript
使用jQuery给Table动态增加行、清空table的方法
Sep 05 jQuery
在 Vue-CLI 中引入 simple-mock实现简易的 API Mock 接口数据模拟
Nov 28 Javascript
Node使用Selenium进行前端自动化操作的代码实现
Oct 10 Javascript
使用JavaScript通过前端发送电子邮件
May 22 Javascript
在vue中实现给每个页面顶部设置title
Jul 29 Javascript
vue实现可拖拽的dialog弹框
May 13 Vue.js
firebug的一个有趣现象介绍
Nov 30 #Javascript
兼容IE、FireFox、Chrome等浏览器的xml处理函数js代码
Nov 30 #Javascript
Javascript的getYear、getFullYear、getUTCFullYear异同分享
Nov 30 #Javascript
chrome原生方法之数组
Nov 30 #Javascript
使用Javascript接收get传递的值的代码
Nov 30 #Javascript
关于递归运算的顺序测试代码
Nov 30 #Javascript
对javascript的一点点认识总结《javascript高级程序设计》读书笔记
Nov 30 #Javascript
You might like
php 获取今日、昨日、上周、本月的起始时间戳和结束时间戳的方法
2013/09/28 PHP
php file_get_contents抓取Gzip网页乱码的三种解决方法
2013/11/12 PHP
Fedora下安装php Redis扩展笔记
2014/09/03 PHP
PHP数组操作简单案例分析
2016/10/15 PHP
PHP使用POP3读取邮箱接收邮件的示例代码
2020/07/08 PHP
6个DIV 135或246间隔一秒轮番显示效果
2010/07/24 Javascript
javascript下高性能字符串连接StringBuffer类
2010/08/16 Javascript
深入理解JavaScript系列(16) 闭包(Closures)
2012/04/12 Javascript
jquery Mobile入门—外部链接切换示例代码
2013/01/08 Javascript
js语法学习之判断一个对象是否为数组
2014/05/13 Javascript
node.js下when.js 的异步编程实践
2014/12/03 Javascript
javascript实现的图片切割多块效果实例
2015/05/07 Javascript
jquery用ajax方式从后台获取json数据后如何将内容填充到下拉列表
2015/08/26 Javascript
一种新的javascript对象创建方式Object.create()
2015/12/28 Javascript
jQuery实现鼠标经过像翻页和描点链接效果
2016/08/08 Javascript
jQuery实现ToolTip元素定位显示功能示例
2016/11/23 Javascript
Bootstrap基本样式学习笔记之图片(6)
2016/12/07 Javascript
详解js的延迟对象、跨域、模板引擎、弹出层、AJAX【附实例下载】
2016/12/19 Javascript
js实现鼠标左右移动,图片也跟着移动效果
2017/01/25 Javascript
Vue 2.0的数据依赖实现原理代码简析
2017/07/10 Javascript
使用vue-aplayer插件时出现的问题的解决
2018/03/02 Javascript
小程序自定义日历效果
2018/12/29 Javascript
Vue使用轮询定时发送请求代码
2020/08/10 Javascript
Python爬虫中urllib库的进阶学习
2018/01/05 Python
python web.py开发httpserver解决跨域问题实例解析
2018/02/12 Python
django1.11.1 models 数据库同步方法
2018/05/30 Python
python random从集合中随机选择元素的方法
2019/01/23 Python
基于python实现蓝牙通信代码实例
2019/11/19 Python
python中文分词库jieba使用方法详解
2020/02/11 Python
CSS3制作hover下划线动画
2017/03/27 HTML / CSS
CK加拿大官网:Calvin Klein加拿大
2020/03/14 全球购物
幼儿园大班教师个人工作总结
2015/02/05 职场文书
怎样写家长意见
2015/06/04 职场文书
2015质检员个人年终工作总结
2015/10/23 职场文书
护士年终工作总结不会写?各科护士模板总结
2020/01/02 职场文书
使用 DataAnt 监控 Apache APISIX的原理解析
2022/07/07 Servers