前端日常

@判断变量是否是数组

var a = [1,2,3]

Object.prototype.toString.call(a) == '[object Array]'

@对象数组合并

Array.prototype.unique3 = function(){    var res = [];    var json = {};    for(var i = 0; i < this.length; i++){        if(!json[this[i].a]){            res.push(this[i]);            json[this[i].a] = 1;        }    }    console.log(res);    return res;}var a = [    {a:22},    {a:33}]var b = [    {a:22},    {a:44},    {a:55}]var c = a.concat(b)c.unique3()

@ js加法运算小数位问题

functionaccAdd(arg1,arg2){

varr1,r2,m;

try{

r1=arg1.toString().split(".")[1].length

}catch(e){

r1=0}try{

r2=arg2.toString().split(".")[1].length}catch(e){r2=0} m=Math.pow(10,Math.max(r1,r2))

return(arg1*m+arg2*m)/m

}




乘法：

functionaccMul(arg1,arg2){

varm=0,s1=arg1.toString(),

s2=arg2.toString();

try{

m+=s1.split(".")[1].length}catch(e){}

try{

m+=s2.split(".")[1].length}catch(e){}

returnNumber(s1.replace(".",""))*Number(s2.replace(".",""))/Math.pow(10,m

)}

除法：

functionaccDiv(arg1,arg2){

vart1=0,t2=0,r1,r2;

try{

t1=arg1.toString().split(".")[1].length}catch(e){

 }try{

 t2=arg2.toString().split(".")[1].length}catch(e){}

 with(Math){

 r1=Number(arg1.toString().replace(".",""))

 r2=Number(arg2.toString().replace(".",""))

return(r1/r2)*pow(10,t2-t1);

}

}

@ iOS输入框输入获取焦点或者输入时，白屏的问题

给父元素添加position：relative

@ 安卓手机输入框被虚拟键盘遮挡的问题

不要给内容区添加定位，比如：position:absolute等；

@ Swiper上拉加载，下拉刷新（3.0版本）

var mySwiper = new Swiper('.swiper-container', {    scrollbar: '.swiper-scrollbar',    direction: 'vertical',    slidesPerView: 'auto',    mousewheelControl: true,    freeMode: true,    onTouchEnd: function(swiper){        console.log(swiper.translate)        if(swiper.translate>60){ //判断下拉刷新            $(".swiper-wrapper").empty();            nums = 0;            render(nums)        }        else if(swiper.translate<-40){ //判断上拉加载新数据            if(mySwiper.isEnd){                render(nums)            }        }    }});

@ 判断js是否加载完成

function loadScript(url,callback){
　　var script=document.createElement('script');
　　　　script.type='text/javascript';
　　　　script.async='async';
　　　　script.src=url;
　　　　document.body.appendChild(script);
　　　　if(script.readyState){   //IE
　　　　　　script.onreadystatechange=function(){
　　　　　　　　if(script.readyState=='complete'||script.readyState=='loaded'){
　　　　　　　　　　script.onreadystatechange=null;
　　　　　　　　　　callback();
　　　　　　　　}
　　　　　　}
　　　　}else{    //非IE
　　　　　　script.onload=function(){callback();}
　　　　}
}

@ git远程覆盖本地

git fetch --all  git reset --hard origin/master 

git pull

@ 保留几位小数

processRes: function (e,n) {    var thisDom = $(e.currentTarget);    var val = thisDom.val();    // var res = /^[0-9]+(\.[0-9]{0,n})?$/;    var res = new RegExp("^\[0-9]+(\\.[0-9]{0,"+ n +"})?$");    var quit = 1;    if(n == 0){        quit = 2;    }    var isTrue = res.test(val);    if (!isTrue) {        if(!val){            thisDom.val("");            return false        }        if(String(val).split(".")[1].length >= (n+1) ){            thisDom.val(val.substr(0, val.length - quit));        }    }},

@、webpack + react/vue/jquery

    https://github.com/xiaoyann/webpack-best-practice

    https://segmentfault.com/a/1190000005969488

@、对象数组排序封装

var a =[    {        name:"北京分公司",        bugCut:22,        bugTime:333,        needCut:44,        needTime:444,        totalTime:666    },    {        name:"广州分公司",        bugCut:11,        bugTime:111,        needCut:22,        needTime:222,        totalTime:123    },    {        name:"东北分公司",        bugCut:66,        bugTime:321,        needCut:2311,        needTime:434,        totalTime:5633    }];function defineSoft(data,field,type) {    function arrSoft(obj1,obj2) {        var val1 = obj1[field];        var val2 = obj2[field];        if(val1 < val2){            if(type == "SToB"){                return -1            }else{                return 1;            }        }else if(val1 > val2){            if(type == "SToB"){                return 1            }else{                return -1;            }        }else{            return 0        }    }    return data.sort(arrSoft)}defineSoft(a,"needTime");

@//react-webapck脚手架

转载：http://blog.csdn.net/adzcsx2/article/details/52993633

npm install -g yo

npm install -g generator-reactpackage

yo reactpackage

//在项目下，运行下列命令行npm install --save-dev sass-loader//因为sass-loader依赖于node-sass，所以还要安装node-sassnpm install --save-dev node-sass

npm run dev //项目开发过程使用，启动服务，实时刷新

npm run build //开发完成之后打包文件（js、css分开打包）

判断android ios
<script type="text/javascript">
var u = navigator.userAgent;
var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
alert('是否是Android：'+isAndroid);
alert('是否是iOS：'+isiOS);
</script>
 
检测自定义类型，用instanceOf
 
 
检测字符串、数字、boller、undefiend都用typeof
Typeof name === “string”
检测函数
Typeof  mfFun === “function”
 
检测数组
Function isArray(value){
Return  Object.prototype.toString.call(value) == “[object Array]”
}
 
 
@ 禁止点击
.box { pointer-events: none; }
 
@ 使用对象的hasOwnProperty()方法。
该方法只能判断自有属性是否存在，对于继承属性会返回false。
var o={x:1};
o.hasOwnProperty("x");    　　 //true，自有属性中有x
o.hasOwnProperty("y");    　　 //false，自有属性中不存在y
o.hasOwnProperty("toString"); //false，这是一个继承属性，但不是自有属性
 
 
@ 清除浮动
.fix{zoom:1;} .fix:after{display:block; content:'clear'; clear:both; line-height:0; visibility:hidden;}
 
 
 
@ Checkbox监听选中事件
$('.check').change(function () {    if($(this).is(':checked')){        console.log(333)    } })
 
 
@ Select对齐方式
select {
    direction: rtl; 右对齐
}
select option {
    direction: ltr;
}
 
@ fastClick 锁住输入框。
在ios中，会出现几秒的输入框没有反应，开始也怎么想不明白，各种尝试，推测，搜索发现原来是使用的轻框架中用到了fastClik引起的，解决的办法就是加上一个样式。
  <div id="content" class="inputcontent needsclick" ></div>
 
1、 for属性可以关联click事件    点击button可以使得div发生点击事件
2、Math.round(11.3)=12
Math.round(-11.3)=-11
3、input边框变蓝色
Outline:none;
4、
$("input [name='sex']:checked").val()
 男 <input type=radio name=sex value="男">
女<input type=radio name=sex value="女">
@ 动态添加元素绑定事件
$("body").delegate(".listdata","click",function(){    console.log(22);})
 
@ 正则验证手机号和固话
(^(0[0-9]{2,3}\-)?([2-9][0-9]{6,7})+(\-[0-9]{1,4})?$)|(^((\(\d{3}\))|(\d{3}\-))?(1[358]\d{9})$)/^(\(\d{3,4}\)|\d{3,4}-|\s)?\d{7,14}$/
/^1[0-9]{10}$/
 
@ 正则验证汉字和字母
var reg = '/^([A-Za-z]|[\u4E00-\u9FA5])+$/';
 
验证整数或小数^[0-9]+(\.[0-9]+)?$
 
验证数字格式，可以是小数，负数，整数
^-?(0|[0-9]*)+(.[0-9]*)?$
 
 
@ IOS   惯性滑动   
overflow:scroll
-webkit-overflow-scrolling : touch;
 
@ Tittle小图标
<link rel="shortcut icon" href="your_ico.ico" type="image/x-icon">
2 <link rel="icon" href="your_ico.ico" type="image/x-icon">
 
@ 字体多次点击会变蓝色
-moz-user-select: none; /*火狐*/
-webkit-user-select: none; /*webkit浏览器*/
-ms-user-select: none; /*IE10*/
-khtml-user-select: none; /*早期浏览器*/
user-select: none;
@ 使用 JS 阻止整个网页的内容被选中
document.body.onselectstart = function () { 
    return false; 
};
 
// 或
document.body.onmousedown = function () { 
    return false; 
}
 
阻止特定区域的内容被选中
var elem = document.getElementById('elemId');
elem.onselectstart = function () {
    return false;
};
@ 数组合并
1. // 第一种  
2. var mergeTo = [4,5,6],  
3.       mergeFrom = [7,8,9];  
4.   
5. mergeTo = mergeTo.concat(mergeFrom);  
6. mergeTo; // is: [4, 5, 6, 7, 8, 9]  
7.   
8. or  
9. var a = [1,2], b = [3,4], c = a.concat(b);  
10.   
11.   
12. // 第二种  
13. var mergeTo = [4,5,6],  
14. var mergeFrom = [7,8,9];  
15.   
16. Array.prototype.push.apply(mergeTo, mergeFrom);  
17.   
18. mergeTo; // is: [4, 5, 6, 7, 8, 9]  
@ 数组排序
var arr= [1,3,2,5,1]arr.sort(function (a,b) {     return b-a;});console.log(arr)
@ 页面跳转方式：
第一种： 
复制代码代码如下:
<script language="javascript" type="text/javascript"> window.location.href="jb51.jsp?backurl="+window.location.href; </script> 
第二种： 
复制代码代码如下:
<script language="javascript"> alert("返回"); window.history.back(-1); </script> 
第三种： 
复制代码代码如下:
<script language="javascript"> window.navigate("jb51.jsp"); </script> 
第四种： 
复制代码代码如下:
<script language="JavaScript"> self.location='jb51.htm'; </script> 
第五种： 
复制代码代码如下:
<script language="javascript"> alert("非法访问！"); top.location='jb51.jsp'; </script> 
第六种：网址从传参获得并转向 
复制代码代码如下:
<script language="javascript" type="text/javascript"> function request(paras){ var url = location.href; var paraString = url.substring(url.indexOf("?")+1,url.length).split("&"); var paraObj = {} for (i=0; j=paraString[i]; i++){ paraObj[j.substring(0,j.indexOf("=")).toLowerCase()] = j.substring(j.indexOf("=")+1,j.length); } var returnValue = paraObj[paras.toLowerCase()]; if(typeof(returnValue)=="undefined"){ return ""; }else{ return returnValue; } } var theurl theurl=request("url"); if (theurl!=''){ location=theurl } </script> 
 
@ jQuery插件支持的转换方式
 
$.parseJSON( jsonstr ); //jQuery.parseJSON(jsonstr),可以将json字符串转换成json对象 
 
2. 浏览器支持的转换方式(Firefox，chrome，opera，safari，ie9，ie8)等浏览器：
JSON.parse(jsonstr); //可以将json字符串转换成json对象 JSON.stringify(jsonobj); //可以将json对象转换成json对符串 
注：ie8(兼容模式),ie7和ie6没有JSON对象，推荐采用JSON官方的方式，引入json.js。 
3. Javascript支持的转换方式
eval('(' + jsonstr + ')'); //可以将json字符串转换成json对象,注意需要在json字符外包裹一对小括号 注：ie8(兼容模式),ie7和ie6也可以使用eval()将字符串转为JSON对象，但不推荐这些方式，这种方式不安全eval会执行json串中的表达式。 4 .JSON官方的转换方式： 
http://www.json.org/提供了一个json.js,这样ie8(兼容模式),ie7和ie6就可以支持JSON对象以及其stringify()和parse()方法； 可以在https://github.com/douglascrockford/JSON-js上获取到这个js，一般现在用json2.js。