javascript日常总结

JS操作小数运算，结果莫名其妙出现多位小数问题

 

Number类型：

Number类型是ECMAScript中最常用和最令人关注的类型了；这种类型使用IEEE754格式来表示整数和浮点数值（浮点数值在某些语言中也被成为双精度数值），为支持各种数据类型，ECMA-262定义了不同的数值面量格式。

十进制：

var intNum=10; //整数

八进制:

var octalNum1=070; //八进制的56

var octalNum2=079; //无效的八进制数值-解析为79

八进制字面量在严格模式下是无效的；

十六进制：

var hexNum1=0xA; //10

切记：在进行运算的时候，所有以八进制和十六进制表示的数值都最终被转换成十进制；

为什么操作小数会出现误差？

浮点数值的最高进度是17位小数，但在进行运算的时候其精确度却远远不如整数；整数在进行运算的时候都会转成10进制； 而java和JavaScript中计算小数运算时，都会先将十进制的小数换算到对应的二进制，一部分小数并不能完整的换算为二进制，这里就出现了第一次的误差。待小数都换算为二进制后，再进行二进制间的运算，得到二进制结果。然后再将二进制结果换算为十进制，这里通常会出现第二次的误差。

所以(0.1+0.2)!=03

解决方式:

程序代码
除法函数，用来得到精确的除法结果
说明：javascript的除法结果会有误差，在两个浮点数相除的时候会比较明显。这个函数返回较为精确的除法结果。
调用：accDiv(arg1,arg2)
返回值：arg1除以arg2的精确结果

1 2 3 4 5 6 7 8 9 10

function accDiv(arg1,arg2){    var t1=0,t2=0,r1,r2;    try{  <span style="font-family:simsun;">   </span>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(".",""))    <span style="font-family:simsun;">   </span>return (r1/r2)*pow(10,t2-t1);  }  <span style="font-family:simsun;">   </span>}

　　给Number类型增加一个div方法，调用起来更加方便。

1 2 3

Number.prototype.div = function (arg){    return accDiv(this, arg);  }

　　乘法函数，用来得到精确的乘法结果
说明：javascript的乘法结果会有误差，在两个浮点数相乘的时候会比较明显。这个函数返回较为精确的乘法结果。
调用：accMul(arg1,arg2)
返回值：arg1乘以arg2的精确结果

function accMul(arg1,arg2){
var m=0,s1=arg1.toString(),
s2=arg2.toString();
try{
m+=s1.split(".")[1].length}catch(e){}
try{
m+=s2.split(".")[1].length}catch(e){}
return Number(s1.replace(".",""))*Number(s2.replace(".",""))/Math.pow(10,m
)}

function accMul(arg1,arg2){    
var m=0,s1=arg1.toString(),  
s2=arg2.toString();    
try{  
m+=s1.split(".")[1].length}catch(e){}    
try{  
m+=s2.split(".")[1].length}catch(e){}    
return Number(s1.replace(".",""))*Number(s2.replace(".",""))/Math.pow(10,m  
)}  

给Number类型增加一个mul方法，调用起来更加方便。

Number.prototype.mul = function (arg){    
return accMul(arg, this);  
}

Number.prototype.mul = function (arg){    
return accMul(arg, this);  
}  

加法函数，用来得到精确的加法结果

说明：javascript的加法结果会有误差，在两个浮点数相加的时候会比较明显。这个函数返回较为精确的加法结果。
调用：accAdd(arg1,arg2)
返回值：arg1加上arg2的精确结果

function accAdd(arg1,arg2){
var r1,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
}

function accAdd(arg1,arg2){   
var r1,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  
}  

给Number类型增加一个add方法，调用起来更加方便。

Number.prototype.add = function (arg){    
return accAdd(arg,this);  
}  

Number.prototype.add = function (arg){    
return accAdd(arg,this);  
}  

在你要用的地方包含这些函数，然后调用它来计算就可以了。
　　比如你要计算：7*0.8 ，则改成 (7).mul(8) 
　　其它运算类似，就可以得到比较精确的结果。

解决方式二：

比较常用的办法，toFixed()，toFixed() 方法可把 Number 四舍五入为指定小数位数的数字。在我们计算的结果后面加上这个方法就OK了；但是对精度会有一丝影响，如果精度要求不高的话推荐使用;

 

jQuery设置disabled属性

先比较下readOnly和disabled：

　　readOnly 只针对input(text/ password)和textarea有效；

　　disabled 对于所有的表单元素都有效，包括select,radio, checkbox, button等。

　　但是表单元素在使用了disabled后，当我们将表单以POST或GET的方式提交的话，这个元素的值不会被传递出去，而readonly会将该值传递出去（这种情况出现在我们将某个表单中的textarea元素设置为disabled或readonly，但是submitbutton却是可以使用的）。

js代码实现：

1 function disableElement(element,val){
2     document.getElementById(element).disabled=val;
3 }

jQuery代码实现：

1 //两种方法设置disabled属性
2 $('#areaSelect').attr("disabled",true);
3 $('#areaSelect').attr("disabled","disabled");
4 
5 //三种方法移除disabled属性
6 $('#areaSelect').attr("disabled",false);
7 $('#areaSelect').removeAttr("disabled");
8 $('#areaSelect').attr("disabled","");

 

 

 

 

 

 

 

 

 

原生js封装的一些jquery方法

 

用js封装一些常用的jquery方法 记录一下

hasClass：判断是否有class

function hasClass(ele, cls) {
　　if (!ele || !cls) return false;
　　if (ele.classList) {
　　　　return ele.classList.contains(cls);
　　} else {
　　　　return ele.className.match(new RegExp('(\s|^)' + cls + '(\s|$)'));
　　}
}

addClass：增加class

function addClass(ele, cls) {
　　if (ele.classList) {
　　　　ele.classList.add(cls);
　　} else {
　　　　if (!hasClass(ele, cls)) ele.className += '' + cls;
　　}
}

removeClass：移除class

function removeClass(ele, cls) {
　　if (ele.classList) {
　　　　ele.classList.remove(cls);
　　} else {
　　　　ele.className = ele.className.replace(new RegExp('(^|\b)' + className.split(' ').join('|') + '(\b|$)', 'gi'), ' ');
　　}
}