10个前端开发的JavaScript优化问题

可莉
• 阅读 553

JavaScript的高效优化一直都是我们前端开发中非常重要的工作,也是很多开发人员无法做好的一部分内容,今天我总结了10个优化问题,大家可以参考来做优化,很多问题都是大家常遇到的。

10个前端开发的JavaScript优化问题

JavaScript优化

==和===的区别

应避免在if和while条件选择语句中的条件判断部分进行赋值,如if (a = b),应写成if (a == b),但是在比较是否相等的情况下,最好使用全等运算符,也就是使用===和!==运算符对比==和!=会好点。因为==和!=运算符会进行强制类型转换

不要使用生偏语法

不要使用生偏语法,和写一些让人疑惑的代码,虽然计算机可以正常识别和运行,但是让人难懂的代码不方便后期维护

函数返回统一类型

虽然JavaScript是弱类型的,在函数里,前面返回是整数型数据,后面返回布尔值都可以正常的编译和运行的,但为了规范和后期维护,应保证函数返回统一的数据类型

总是检查数据类型

要检查你的方法传入的参数,一方面是安全性,另一方面是可实用性。用户随时都有可能会误操作传入错误的数据。这不是因为他们的问题,而是因为他们的思维方式和使用习惯和你不一样。所以可以使用typeof方法来帮助你检测function接受的参数是否合法

何时用单引号,何时用双引号

在JavaScript当中,虽然双引号和单引号都可以用来表示字符串, 但是为了避免混乱,所以我们建议在HTML中使用双引号,在JavaScript中使用单引号。不过为了兼容各个浏览器,也为了解析时不会出错,定义JSON对象时,最好使用双引号

删除DOM节点

删除DOM节点之前,记住要删除注册在该节点上的事件,不管是用observe方式还是用attachEvent方式来注册的事件,否则会出现无法回收的内存。此外,在removeChild和innerHTML=’ ’这两个,尽量选择第二个. 因为在sIEve(内存泄露监测工具)中监测的结果是用removeChild无法有效地释放DOM节点

多个类型声明

在JavaScript中所有变量都可以使用单个var语句来声明,这样就是组合在一起的语句,可以减少整个脚本的执行时间。

插入迭代器

如var name=values[i]; i++;这两条语句可以写成var name=values[i++]

浮点数转换成整型

很多人经常喜欢使用parseInt()来做转成整数,其实parseInt()是用于将字符串转换成整数的,而不是用于浮点数和整型之间转换的。浮点转整型我们应该使用Math.floor()或者Math.round()

避免双重解释

要提高代码性能,就尽可能避免出现需要按照JavaScript解释的字符串,也就是

1.尽可能少使用eval函数

使用eval相当于在运行时再次调用解释引擎对内容进行运行,需要消耗大量时间。同时,使用Eval带来的安全性问题也是不容忽视的。

2.不使用Function构造器

不要给setTimeout或者setInterval传递字符串参数

10个前端开发的JavaScript优化问题

最后,建议大家永远不要忽略代码优化工作,重构是一项从项目开始到结束需要持续的工作,只有不断的优化代码才能让代码的执行效率越来越好

10个前端开发的JavaScript优化问题

10个前端开发的JavaScript优化问题

本文分享自微信公众号 - 前端研究所(WEBqdyjs)。
如有侵权,请联系 support@oschina.cn 删除。
本文参与“OSC源创计划”,欢迎正在阅读的你也加入,一起分享。

点赞
收藏
评论区
推荐文章
blmius blmius
3年前
MySQL:[Err] 1292 - Incorrect datetime value: ‘0000-00-00 00:00:00‘ for column ‘CREATE_TIME‘ at row 1
文章目录问题用navicat导入数据时,报错:原因这是因为当前的MySQL不支持datetime为0的情况。解决修改sql\mode:sql\mode:SQLMode定义了MySQL应支持的SQL语法、数据校验等,这样可以更容易地在不同的环境中使用MySQL。全局s
Wesley13 Wesley13
3年前
java将前端的json数组字符串转换为列表
记录下在前端通过ajax提交了一个json数组的字符串,在后端如何转换为列表。前端数据转化与请求varcontracts{id:'1',name:'yanggb合同1'},{id:'2',name:'yanggb合同2'},{id:'3',name:'yang
皕杰报表之UUID
​在我们用皕杰报表工具设计填报报表时,如何在新增行里自动增加id呢?能新增整数排序id吗?目前可以在新增行里自动增加id,但只能用uuid函数增加UUID编码,不能新增整数排序id。uuid函数说明:获取一个UUID,可以在填报表中用来创建数据ID语法:uuid()或uuid(sep)参数说明:sep布尔值,生成的uuid中是否包含分隔符'',缺省为
待兔 待兔
3个月前
手写Java HashMap源码
HashMap的使用教程HashMap的使用教程HashMap的使用教程HashMap的使用教程HashMap的使用教程22
Jacquelyn38 Jacquelyn38
3年前
2020年前端实用代码段,为你的工作保驾护航
有空的时候,自己总结了几个代码段,在开发中也经常使用,谢谢。1、使用解构获取json数据let jsonData  id: 1,status: "OK",data: 'a', 'b';let  id, status, data: number   jsonData;console.log(id, status, number )
Souleigh ✨ Souleigh ✨
3年前
前端性能优化 - 雅虎军规
无论是在工作中,还是在面试中,web前端性能的优化都是很重要的,那么我们进行优化需要从哪些方面入手呢?可以遵循雅虎的前端优化35条军规,这样对于优化有一个比较清晰的方向.35条军规1.尽量减少HTTP请求个数——须权衡2.使用CDN(内容分发网络)3.为文件头指定Expires或CacheControl,使内容具有缓存性。4.避免空的
Stella981 Stella981
3年前
KVM调整cpu和内存
一.修改kvm虚拟机的配置1、virsheditcentos7找到“memory”和“vcpu”标签,将<namecentos7</name<uuid2220a6d1a36a4fbb8523e078b3dfe795</uuid
Stella981 Stella981
3年前
Android So动态加载 优雅实现与原理分析
背景:漫品Android客户端集成适配转换功能(基于目标识别(So库35M)和人脸识别库(5M)),导致apk体积50M左右,为优化客户端体验,决定实现So文件动态加载.!(https://oscimg.oschina.net/oscnet/00d1ff90e4b34869664fef59e3ec3fdd20b.png)点击上方“蓝字”关注我
Wesley13 Wesley13
3年前
MySQL部分从库上面因为大量的临时表tmp_table造成慢查询
背景描述Time:20190124T00:08:14.70572408:00User@Host:@Id:Schema:sentrymetaLast_errno:0Killed:0Query_time:0.315758Lock_
Python进阶者 Python进阶者
9个月前
Excel中这日期老是出来00:00:00,怎么用Pandas把这个去除
大家好,我是皮皮。一、前言前几天在Python白银交流群【上海新年人】问了一个Pandas数据筛选的问题。问题如下:这日期老是出来00:00:00,怎么把这个去除。二、实现过程后来【论草莓如何成为冻干莓】给了一个思路和代码如下:pd.toexcel之前把这