前端js代码优化
今天给大家分享下js代码优化的相关技巧。
1.使用“+”转换为数值
我们平时开发过程中需要将数字字符串创转为number类型,大多数都会用JavaScript parseInt() 函数,请看我下面的例子:
function toNumber(strNumber){
return +strNumber;
}
console.log(toNumber("123456"));// 123456
console.log(toNumber("abc"));// NaN
//作用于Date函数直接返回时间戳
console.log(+new Date());//
注意只能用于数字字符串,否则返回“NaN”。
2.减少条件代码
if(conected){
login();
}
//上述可以简写为
conected && login();
3.在循环中缓存array.length
我们在开发中,通常遇到要循环遍历数组的情况,大家一般都会像下面一样写循环遍历,循环体中,每循环一次,就要重计算数组长度,如果数组太大,会影响程序性能。我们应该缓存数组的长度,提高程序性能。
//优化前
for( var i=0;i<array.length;i++){
......
}
//优化后
for( var i=0 , length = array.length;i<length;i++){
......
}
4.获取数组中最后的元素
var array = [1,2,3,4,5,6];
console.log(array.slice(-1));// [6]
console.log(array.slice(-2));// [5,6]
console.log(array.slice(-3));// [4,5,6]
5.数组截断
var array = [1,2,3,4,5,6];
console.log(array.length);//
array.length = 3;
console.log(array.length);//
console.log(array);// [1,2,3]
6.数组合并
在开发中,我遇到一次需要:实现下拉刷新的功能,需要不断向数组中添加新数组。我当时用到的是Array.concat()方法。但是数据量大的时候会出现长时间数据加载不出来的情况。我在网上查找了半天解决了这个问题,使用Array.push.apply(arry1,arry2)来实现。减少内存消耗。
//优化前
var arry1 = [1,2,3];
var arry2 = [4,5,6];
console.log(arry1.concat(arry2));//[1,2,3,4,5,6] //优化后
var arry3 = [1,2,3];
var arry4 = [4,5,6];
console.log(arry3.push.apply(arry4));//[1,2,3,4,5,6]
今天的知识分享到这里,希望大家每天都能进步一点点!
toNumber
前端js代码优化的更多相关文章
- 前端Js框架汇总
概述: 有些日子没有正襟危坐写博客了,互联网飞速发展的时代,技术更新迭代的速度也在加快.看着Java.Js.Swift在各领域心花路放,也是煞是羡慕.寻了寻.net的消息,也是振奋人心,.net co ...
- 闲聊——浅谈前端js模块化演变
function时代 前端这几年发展太快了,我学习的速度都跟不上演变的速度了(门派太多了,后台都是大牛公司支撑类似于facebook的react.google的angular,angular的1.0还 ...
- json处理总结(前端js和后端java)
前端(js): json是以文本,即字符串的形式传递的,而JS操作的是JSON对象,所以,JSON对象和JSON字符串之间的相互转换是关键,下面将介绍两者之间的相互转换. json字符串:var st ...
- 前端js文件合并三种方式
最近在思考前端js文件该如何合并,当然不包括不能合并文件,而是我们能合并的文件,想了想应该也只有三种方式. 三个方式如下: 1. 一个大文件,所有js合并成一个大文件,所有页面都引用它. 2. 各个页 ...
- 2015 前端[JS]工程师必知必会
2015 前端[JS]工程师必知必会 本文摘自:http://zhuanlan.zhihu.com/FrontendMagazine/20002850 ,因为好东东西暂时没看懂,所以暂时保留下来,供以 ...
- RSA加密前端JS加密,后端asp.net解密,报异常
RSA加密前端JS加密,后端asp.net解密,报异常 参考引用:http://www.ohdave.com/rsa/的JS加密库 前端JS加密代码: function GetChangeStr() ...
- 前端js的书写规范和高效维护的方案_自我总结使用的方案
作为程序员,人生最值得幸福的事有几件: 解决困扰了很长时间的问题 升职加薪 找个漂亮又靠谱的对象 深得领导的喜欢 带领团队冲锋陷阵 ... 哈哈,这些都是梦想,暂时想想就好了.这肯定和我说的东西不符合 ...
- 前端js,css文件合并三种方式,bat命令
前端js,css文件合并三种方式,bat命令 前端js文件该如何合并三个方式如下:1. 一个大文件,所有js合并成一个大文件,所有页面都引用它.2. 各个页面大文件,各自页面合并生成自己所需js的大文 ...
- 前端js上传文件 到后端接收文件
下面是前端js代码: <html> <head> <meta http-equiv="Content-Type" content="text ...
随机推荐
- es6语法部分浏览器支持引发的坑
es2015部分浏览器支持踩的坑 自从es2015出现以来,以其更丰富的api和简介的语法,使得js功能越来越丰富写起来也更便捷.比较早先的时候,浏览器是完全不支持的,我们使用的时候,必须要使用bab ...
- javascript中window.location.search的用法和作用。
用该属性获取页面 URL 地址: window.location 对象所包含的属性 属性 描述 hash 从井号 (#) 开始的 URL(锚) host 主机名和当前 URL 的端口号 hostnam ...
- shopnc前台登陆不进去解决方法
安装好shopnc后,注册新用户成功,且登陆后提示登陆成功,但是一两秒后自动跳转回登陆页面,需要重新登陆问题 PHP写session不是自动起的,需要修改后才行,所以 找到PHP的php.ini配置文 ...
- python3 第二章 - 第一个程序
1、安装 打开官网 https://www.python.org/downloads/ 下载python3.6.4 如果你是windows\mac电脑,直接双击安装包,一路next即可,如果你是lin ...
- python_如何通过实例方法名字调用方法?
案例: 某项目中,我们的代码使用的2个不同库中的图形类: Circle,Triangle 这两个类中都有一个获取面积的方法接口,但是接口的名字不一样 需求: 统一这些接口,不关心具体的接口,只要我调用 ...
- python_如何通过twisted实现数据库异步插入?
如何通过twisted实现数据库异步插入? 1. 导入adbapi 2. 生成数据库连接池 3. 执行数据数据库插入操作 4. 打印错误信息,并排错 #!/usr/bin/python3 __auth ...
- 第一个简单的maven项目
学习一个新的东西,最快的方式就是实践.所以我们也不用多说什么了,直接拿一个项目来练手.下面的整理取自maven权威指南,在一堆maven资料中,我觉得这本书写的最好. 简介 我们介绍一个用Maven ...
- 开发步骤Dubbo、spring mvc、springboot、SSM开发步骤
一.Dubbo开发步骤: 链接:https://pan.baidu.com/s/1pMPO1kf 密码:9zaa 第一: 1.创建consumer工程2.在pom.xml文件下添加配置3.添加appl ...
- PhpStudy 升级 MySQL 版本到5.7
1:备份当前数据库数据. 最好是导成 SQL 文件 2:备份 PhpStudy 下的 MySQL 文件夹.以防升级失败.还可以使用旧版本的数据库 3:下载MySQL5.7.解压.然后放在 PhpStu ...
- 前端自动化测试神器-Katalon进阶用法
前言 上一篇介绍了Katalon的基础用法,本篇继续介绍一些进阶的用法. Keyword 和 Method Call Statement Keyword Keyword就是自定义方法,该方法在当前项目 ...