js常用方法

作者: 刘晓洋 | 来源:发表于2017-07-11 19:39 被阅读0次

JavaScript数组常用方法
js基础了解
vue axios cdn 封装
2016-08-05学习笔记
JsUtil
js 常用方法总结
小程序-常用utils
日期格式化等方法
moment用法
Recent Problems

任意数求和

function sum(){
var total = 0;
for(var i=0;i<arguments.length;i++){
var cur = Number(arguments[i])
if(!isNaN(cur)){
total += cur;
}
}
console.log(total);
}

9*9乘法表

var str = '';
str+='<ul>';
    i  行
    for(var i=1;i<=9;i++){
    str+='<li>';
        span  i
        j  列
        for(var j=1;j<=i;j++){
        str+='<span>';
                    i=3  j=2
                        str+= j+' * '+i+' = '+i*j;
                            2*3=6
                    str+='</span>';
        }
        str+='</li>';
    }
    str+='</ul>';

数组去重

var obj = {};
for(var i=0;i<ary.length;i++){
var cur  = ary[i];
if(obj[cur]==cur){
ary[i] = ary[ary.length-1];
i--;
continue;
}
obj[cur] = cur;
}

sort思想

Array.prototype.rmsame=function(){
var ary=this.sort(function(a,b){return a-b});
for(var i=0; i<ary.length; i++){
if(ary[i]===ary[i+1]){
ary.splice(i,1);
i--;
}
}
return ary;
};

双循环思想

Array.prototype.rmsame=function(){
//this->实例；
for(var i=0; i<this.length; i++){
var oLi=this[i];
for(var j=i+1; j<this.length; j++){
if(oLi===this[j]){//说明重复了
this.splice(j,1);
j--;
}
}
}
return this;
};

快速排序

var ary = [1,2,6,5,3,8,7];
function quickSort(ary){
if(ary.length<=1){
return ary;
}
var cenVal = ary.splice(0,1)[0];
var left = [];
var right = [];
for(var i=0;i<ary.length;i++){
var cur = ary[i];
if(cur<cenVal){
left.push(cur)
}else{

right.push(cur);
}
}
return quickSort(left).concat([cenVal],quickSort(right))
}
console.log(quickSort(ary));

插入排序

var array = [4,3,2,5,6,7,1]
function insertSort(ary){
var left = [];
left.push(ary[0]);
for(var i=1;i<ary.length;i++){
var cur = ary[i];
for(var j=left.length-1;j>=0;j--){
if(cur<left[j]){
if(j==0){
left.unshift(cur);
}
continue;
}else{
left.splice(j+1,0,cur);
break;//循环结束，就不再比较
}
}
}
return left;
}
var a = insertSort(array);
console.log(a);

冒泡排序

for(var i=0;i<ary.length-1;i++){
for(var j=0;j<ary.length-1-i;j++){
if(ary[j]>ary[j+1]){
ary[j] = ary[j]+ary[j+1];
ary[j+1] = ary[j]-ary[j+1];
ary[j] = ary[j]-ary[j+1];
}
}
}
console.log(ary);

判断是否为公有属性方法的封装

function  hasPubProperty(attr,obj){
return attr in obj && !obj.hasOwnProperty(attr);
}

forEach的封装

Array.prototype.myForEach=function(callback,context){
//this ->实例；ary ary1
context=context||window;
if('forEach' in Array.prototype){//标准浏览器的处理；
this.forEach(callback,context);
return;
}
for(var i=0; i<this.length; i++){//1）callback被调用的次数；
callback.call(context,this[i],i,this);//2）callback传参；3）this指向；
}
}

map的封装

Array.prototype.myMap=function(callback,context){
context=context||window;
//浏览器判断-性能优化
if('map' in Array.prototype){
return  this.map(callback,context);
}
var ary=[];
for(var i=0; i<this.length; i++){
var res=callback.call(context,this[i],i,this);
ary.push(res);
}
return ary;
}

类数组转数组

function makeArray(arg){
var ary=[];
try{
return Array.prototype.slice.call(arg);
}catch (e){
for(var i=0; i<arg.length; i++){
ary.push(arg[i]);
}
return ary;
}
}

求平均数

function average(){
var ary=Array.prototype.slice.call(arguments);
ary.sort(function(a,b){return a-b});
ary.pop();
ary.shift();
return (eval(ary.join('+'))/ary.length).toFixed(2)
}
alert(average(1.777,9.237,6.777,8.477,3.733))

三种排序
思路1：sort排序

var ary=[20,3,12,6,34,5]
ary.sort(function(a,b){return a-b});
var max=ary.pop(),min=ary.shift();
console.log(max,min)

思路2：假设法-假设法假设的数字

var max=ary[0];
var min=ary[0];
for(var i=0; i<ary.length; i++){
if(ary[i]>max) max=ary[i];
if(ary[i]<min) min=ary[i];
}

思路3：Math.max配合eval

var str1=ary.toString();
alert(eval('Math.max('+str1+')'))
alert(eval('Math.min('+str1+')'))

思路4

alert(Math.max.apply(undefined,ary))

倒计时

countDown();
setInterval(countDown,1000);
function toDou(n){
return n>=0 && n<10?'0'+n:''+n;
}
function countDown(){
var oDate=new Date();
var s=Math.floor((new Date('2016/11/3 18:00:00')-oDate)/1000);
//秒转换用%的思想：24*60*60=86400;
var d=Math.floor(s/86400);//整数部分求的是天数
s%=86400;//剩下的秒数；
var h=Math.floor(s/3600);//整数部分是小时；
s%=3600;
var m=Math.floor(s/60);//整数部分是分；
s%=60;//剩下的秒数；
var str=toDou(d)+'天 '+toDou(h)+':'+toDou(m)+':'+toDou(s);
oSpan.innerHTML=str;
}

获取随机验证码
思路1：for循环

var strCode='abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789';
var str='';
for(var i=0; i<4; i++){
var rnd=Math.round(Math.random()*61);
//如果字符串中没有，放字符串中拼接，如果字符串中有了；预防塌陷
if(str.indexOf(strCode.charAt(rnd)) == -1){
str+=strCode.charAt(rnd);
}else{
i--;
}
}

思路2：while循环

while(str.length<4){
var rnd=Math.round(Math.random()*61);
if(str.indexOf(strCode.charAt(rnd)) == -1){
str+=strCode.charAt(rnd);
}
}

求最大值和最小值
思路1：sort排序

var ary=[18,2,6,23,9];
ary.sort(function(a,b){return a-b});
var max=ary.pop();
var min=ary.shift();

思路2：假设法

var max=ary[0];
var min=ary[0];
for(var i=0; i<ary.length; i++){
var cur=ary[i];
if(cur>max) max=cur;
if(cur<min) min=cur;
}
alert(max);
alert(min);

思路3：Math.max 配合 eval;

var max=eval('Math.max('+ary.toString()+')');
var min=eval('Math.min('+ary.toString()+')');*/

思路4：apply

var max=Math.max.apply(null,ary);
alert(max);

求平均值

function average(){
//1.类数组转数组
var ary=Array.prototype.slice.call(arguments);
//2.sort排序
ary.sort(function(a,b){return a-b});
//3.掐头去尾
ary.pop(); ary.shift();
//4.求平均值
return (eval(ary.join('+'))/ary.length).toFixed(2)
}
alert(average(9.777,3.777,2.777,14.757,58.773))

求出现次数最多的单词

var str='aaaccccbbbdddCCCCCAAAAABbbbAAAAcccDDdDD';
//1.把字符串进行排序
str=str.split('').sort(function(a,b){return a.localeCompare(b)}).join('');
//2.重复子项 和  arguments（字符串replace方法）；
var max=0;
var maxStr='';
str.replace(/(\w)\1+/gi,function($0,$1){
//$0:计算出单词出现的次数； $1:找出出现次数对应的单词；
if($0.length>max) {
max=$0.length;
maxStr=$1;
}else if($0.length===max){
maxStr+=$1;
}
});

思路2：用重复子项；

str=str.split('').sort(function(a,b){return a.localeCompare(b)}).join('');
var max=0;
var maxStr='';
str.replace(/(\w)\1+/gi,function($0,$1){
if($0.length>max){
max=$0.length;
maxStr=$1;
}else if($0.length==max){
maxStr+=','+$1;
}
});*/
/*//利用对象不重名的特性；求出现次数最多的单词，以及出现多少次？
var obj={};
for(var i=0; i<str.length; i++){
var cur=str[i].toLowerCase();
if(obj[cur]){
obj[cur]++;
}else{
obj[cur]=1;
}
}

2.用假设法求出出现最多的次数；

var max=obj.d;
for(var attr in obj){
if(obj[attr]>max) max=obj[attr];
}

3.根据次数求出出现次数最多的单词，出现次数最多的单词可能有多个；

var ary=[];
for(var attr in obj){
if(obj[attr]==max){
ary.push(attr);
}
}
console.log('出现次数最多的单词'+ary+'；出现'+max+'次');*/

日期格式化封装
转数组思路1.把字符串中的数字，成组的拎出来,放到数组中去；

var strCode = '2016-6-23 00:41:30';
var tmp = '{0}年{1}月{2}日';
/*var reg=/^(\d{4})[\-](\d{1,2})[\-](\d{1,2})\s+(\d{1,2})[\:](\d{1,2})[\:](\d{1,2})$/;
var ary=[];
strCode.replace(reg,function(){
ary=Array.prototype.slice.call(arguments,1,arguments.length-2);
});

转数组思路2：

 var ary=strCode.match(/\d+/g);
 var ary=strCode.split(/\D+/g);
//需求：strCode.formatDate(tmp);->"2016年11月6日 11时5分30秒";
String.prototype.formatDate = function (tmp) {
//this->实例；
//1.把实例字符串中的数组存到数组中；
var ary=this.match(/\d+/g);
//2.拿数组中的内容，替换模板
var tmpStr=tmp||'{0}年{1}月{2}日 {3}时{4}分{5}秒';
tmpStr=tmpStr.replace(/{(\d)}/g,function($0,$1){
var n=ary[$1];
n=n>=0 && n<10? '0'+Number(n):n;
return n;
});
return tmpStr;
}
console.log(strCode.formatDate(tmp));

获取地址栏中的参数

var str='www.baidu.com?name=zhfueng&age=8&sex=undefined';
//{name:zhfueng,age:8};
/*var reg=/([^?=&]+)=([^?=&]+)/g;
var obj={};
str.replace(reg,function($0,$1,$2){
obj[$1]=$2;
});
console.log(obj);*/
//需求：str.queryURLParameter(); ->键值对的对象；{name:zhfueng,age:8}
String.prototype.queryURLParameter=function(){
//this->实例字符串
var reg=/([^?=&]+)=([^?=&]+)/g;
var obj={};
this.replace(reg,function($0,$1,$2){
obj[$1]=$2;
})
return obj;
}
console.log(str.queryURLParameter());

exec封装match

var str='zhufeng2016zhanwang2017huigu2015';
var reg=/\d+/g;
String.prototype.myMatch=function(reg){
//this-实例str
var res=reg.exec(this);
var ary=[];
while(res){
ary.push(res[0]);
res=reg.exec(this);
}
return ary;
};
alert(str.myMatch(reg));//[2016,2017,2015]

domReady

function domReady(fn){
if(document.addEventListener){
document.addEventListener('DOMContentLoaded',fn);
}else{
//监听页面的变化
document.onreadystatechange=function(){
//当页面加载完成的时候，开始执行函数；
if(document.readyState==='complete'){
fn();
}
}
}```
}