对js的一些总结

---------最近工作老是在做前端页面,不可避免的使用了js。下面针对工作中使用到的js进行整理总结。

 类型


总所周知,js是个弱类型语言,可以使用var声明一切类型变量;js和其他的语言具有的数据类型差不多,除了Number数值类型需要注意。在对变量进行具体的赋值后;变量会与值的类型同步;而通过DOM操作获取的值类型往往是字符串类型,所以类型转换一般为字符串转其他。记录一下js常用的类型转化方法。

string 转换为其他类型

方法:parseInt() 、parseFloat() 、Number() 其他类似;这些都是强制转换的方法 ;查看变量类型使用typeof();都是原生级的方法,直接用!

坑:NaN ----非数值类型,表明不是数字;往往在类型转化后或者数值运算后出现的结果。出现NaN说明类型转换有问题或者运算的类型不对称,这时候检查转换的值是否出现了不该出现的东西,比如中文、特殊字符、非数字等。

类型转换完当然要计算的啦,加、减、乘、除、来一套,顺便带上浮点运算。

加法:坑:小心变成字符串拼接 出现1+1 =11的情况,还是类型转换问题,除了转换好类型,也可以这样操作 a*1+b*1;或者使用eval();

减法:暂时没有被坑~~~;

乘法:同上;

除法:同上;

浮点运算:js的浮点运算,让以上四大法全有了坑;坑:运算结果出现5.8999999999这种情况;

解决方法:使用以下代码  转载至:http://www.cnblogs.com/jiahaipeng/archive/2008/10/29/1321821.html

 1 //除法函数,用来得到精确的除法结果
 2 //说明:javascript的除法结果会有误差,在两个浮点数相除的时候会比较明显。这个函数返回较为精确的除法结果。
 3 //调用:accDiv(arg1,arg2)
 4 //返回值:arg1除以arg2的精确结果
 5 function accDiv(arg1,arg2){
 6     var t1=0,t2=0,r1,r2;
 7     try{t1=arg1.toString().split(".")[1].length}catch(e){}
 8     try{t2=arg2.toString().split(".")[1].length}catch(e){}
 9     with(Math){
10         r1=Number(arg1.toString().replace(".",""));
11         r2=Number(arg2.toString().replace(".",""));
12         return (r1/r2)*pow(10,t2-t1);
13     }
14 }
15 //给Number类型增加一个div方法,调用起来更加方便。
16 Number.prototype.div = function (arg){
17     return accDiv(this, arg);
18 };
19 //乘法函数,用来得到精确的乘法结果
20 //说明:javascript的乘法结果会有误差,在两个浮点数相乘的时候会比较明显。这个函数返回较为精确的乘法结果。
21 //调用:accMul(arg1,arg2)
22 //返回值:arg1乘以arg2的精确结果
23 function accMul(arg1,arg2)
24 {
25     var m=0,s1=arg1.toString(),s2=arg2.toString();
26     try{m+=s1.split(".")[1].length}catch(e){}
27     try{m+=s2.split(".")[1].length}catch(e){}
28     return Number(s1.replace(".",""))*Number(s2.replace(".",""))/Math.pow(10,m);
29 }
30 //给Number类型增加一个mul方法,调用起来更加方便。
31 Number.prototype.mul = function (arg){
32     return accMul(arg, this);
33 };
34 //加法函数,用来得到精确的加法结果
35 //说明:javascript的加法结果会有误差,在两个浮点数相加的时候会比较明显。这个函数返回较为精确的加法结果。
36 //调用:accAdd(arg1,arg2)
37 //返回值:arg1加上arg2的精确结果
38 function accAdd(arg1,arg2){
39     var r1,r2,m;
40     try{r1=arg1.toString().split(".")[1].length}catch(e){r1=0}
41     try{r2=arg2.toString().split(".")[1].length}catch(e){r2=0}
42     m=Math.pow(10,Math.max(r1,r2));
43     return (arg1*m+arg2*m)/m;
44 }
45 //给Number类型增加一个add方法,调用起来更加方便。
46 Number.prototype.add = function (arg){
47     return accAdd(arg,this);
48 }
49 //减法函数
50 function accSub(arg1,arg2){
51      var r1,r2,m,n;
52      try{r1=arg1.toString().split(".")[1].length}catch(e){r1=0}
53      try{r2=arg2.toString().split(".")[1].length}catch(e){r2=0}
54      m=Math.pow(10,Math.max(r1,r2));
55      //last modify by deeka
56      //动态控制精度长度
57      n=(r1>=r2)?r1:r2;
58      return ((arg2*m-arg1*m)/m).toFixed(n);
59 }
60 ///给number类增加一个sub方法,调用起来更加方便
61 Number.prototype.sub = function (arg){
62     return accSub(arg,this);
63 }

调用:数字.mul(数字);也可以自己进行浮点的”精度”进行设置,使用toFixed(2);保留两位小数(四舍五入),然后再参与运算!

DOM操作 


js技术的重中之重,分别写一下原生javascript和jquery操作dom的方法

 JS测试调试

alert() 、console.log()  最后+Chrome F12 其他不写了 (懒

未完待续!

时间: 2024-11-10 08:28:03

对js的一些总结的相关文章

【API】高德地图API JS实现获取坐标和回显点标记

1.搜索+选择+获取经纬度和详细地址 2.回显数据并点标记 3.实现 第一步:引入资源文件 <!--引入高德地图JSAPI --><script src="//webapi.amap.com/maps?v=1.3&key=在官网申请一个key"></script><!--引入UI组件库(1.0版本) --><script src="//webapi.amap.com/ui/1.0/main.js">

js跨域

第一次写博客,好紧张,不知道能写成啥样,哈哈哈. 自己的一知片解,有错请多多指教,嘻嘻嘻. 一.何为跨域? 只要协议.域名.端口后任何一个不同,就是跨域. 举个例子: http://www.example.com 协议不同 https://www.example.com http://www.example.com 域名不同 http://www.test.com http://www.example.com 端口不同 http://www.example.com:81 注意:ip相同,域名不同

Vue.js学习笔记:属性绑定 v-bind

v-bind  主要用于属性绑定,Vue官方提供了一个简写方式 :bind,例如: <!-- 完整语法 --> <a v-bind:href="url"></a> <!-- 缩写 --> <a :href="url"></a> 绑定HTML Class 一.对象语法: 我们可以给v-bind:class 一个对象,以动态地切换class.注意:v-bind:class指令可以与普通的class特

node.js的安装及配置

一.安装 直接在浏览器搜索node.js,在官网上下载(一般旧版的更加稳定,比如下载4.4.7版本) 点击DOWNLOADS 往下翻,点击Previous Release Windows下载msi(64位/32位) 根据提示一步步安装,安装之后的文件夹如下: 在cmd命令行下输入node -v,如果出现如下,说明安装成功: 二.关于配置 在安装路径下新建两个文件夹: 创建完两个空文件夹之后,打开cmd命令窗口,输入 npm config set prefix "D:\Program Files

Node.js 使用angularjs取得Nodejs http服务端返回的JSON数组示例

server.js代码: // 内置http模块,提供了http服务器和客户端功能(path模块也是内置模块,而mime是附加模块) var http=require("http"); // 创建服务器,创建HTTP服务器要调用http.createServer()函数,它只有一个参数,是个回调函数,服务器每次收到http请求后都会调用这个回调函数.服务器每收到一条http请求,都会用新的request和response对象触发请求函数. var server=http.createS

Knockout.js简介

Knockout是一款很优秀的JavaScript库,通过应用MVVM模式使JavaScript前端UI简单化.任何时候你的局部UI内容需要自动更新,KO都可以很简单的帮你实现,并且非常易于维护. Knockout的3个核心功能是: ? 属性监控与依赖跟踪 ? 声明式绑定 ? 模板机制 MVVM Model-View-View Model (MVVM)是一种创建用户界面的设计模式. ? Model:用于存储应用程序数据,表示业务领域的对象和数据操作,并且独立于任何界面. 当使用KO的时候,通常是

vue.js 入门

简单一句话来描述:vue.js是一个前端框架. 官方文档:https://cn.vuejs.org/v2/guide/index.html 虽然,我以前也会改一些前端样式,但主要是基于HTML和CSS,HTML主要控制页面的结构,CSS主要来控制样式.涉及到JavaScript就比较小白了. 我花了一个下午照着官方文档做练习,当然是只创建一个xxx_demo.html文件,在<script></script> 标签对之间写 Vue.js语法.这不算错,但在工程化的今天,这么学得猴年

JS高程3:JSON

JSON,JavaScript Object Notation,JS对象表示法,是目前最常见的结构化数据传输形式. JSON并非编程语言,而是一种数据结构,像mp4.avi一样,只是一种数据格式而已.(数据结构可以包含很多数据类型) JSON值的类型 简单值 对象 数组 简单值:字符串.数字.布尔值和null,注意不包括undefined. 注意:JSON中的字符串必须用双引号. 对象:对象就是无序的键值对,而键值中的值也可以是简单值.对象或者数组. 注意:JSON中对象的属性必须用双引号括起来

js装饰器

本文是廖雪峰老师js教程的学习笔记 JavaScript的所有对象都是动态的,即使内置的函数,我们也可以重新指向新的函数. 利用apply(),我们还可以动态改变函数的行为. 现在假定我们想统计一下代码一共调用了多少次parseInt(),可以把所有的调用都找出来,然后手动加上count += 1,不过这样做太傻了.最佳方案是用我们自己的函数替换掉默认的parseInt(): var count = 0; var oldParseInt = parseInt; // 保存原函数 window.p

Vue.js系列之项目搭建(vue2.0 + vue-cli + webpack )

1.安装node node.js环境(npm包管理器) cnpm npm的淘宝镜像 从node.js官网下载并安装node,安装过程很简单,一路"下一步"就可以了(傻瓜式安装).安装完成之后,打开命令行工具,输入 node -v,如果出现相应的版本号,则说明安装成功. npm包管理器,是集成在node中的,所以,直接输入 npm -v就会显示出npm的版本信息. 2.安装cnpm 在命令行中输入 npm install -g cnpm --registry=http://registr