js 代码的优化 ,完全是照搬,不过挺好使
来源:互联网 发布:java底层框架源码 编辑:程序博客网 时间:2024/04/30 10:20
<div class="one" id="one"></div>
<input type="button" value="效率低" onclick="func1()" />
<input type="button" value="效率高" onclick="func2()" />
//效率低的
function func1(){
var start = new Date().getTime();
var template = "";
for(var i = 0; i < 100000; i++){
template += "<input type='button' value='a'>";
}
var end = new Date().getTime();
document.getElementById("one").innerHTML = template;
console.log("用时:" + (end - start) + "毫秒");
}
//效率高的
function func2(){
var start = new Date().getTime();
var array = [];
for(var i = 0; i < 100000; i++){
array[i] = "<input type='button' value='a'>";
}
var end = new Date().getTime();
document.getElementById("one").innerHTML = array.join("");
console.log("用时:" + (end - start) + "毫秒");
}
*/
2、for循环
for循环是我们经常会遇到的情况,我们先看看下面例子:
/*
var arr = [];
for(var i = 0; i < 100000; i++){
arr[i] = "<div>" + i + "</div>";
}
document.body.innerHTML += arr.join("");
//效率低的
function func1(){
var divs = document.getElementsByTagName("div");
var start = new Date().getTime();
for(var i = 0; i < divs.length; i++){
//"效率低"
}
var end = new Date().getTime();
console.log("用时:" + (end - start) + "毫秒");
}
//效率高的
function func2(){
var divs = document.getElementsByTagName("div");
var start = new Date().getTime();
for(var i = 0, len = divs.length; i < len; i++){
//"效率高"
}
var end = new Date().getTime();
console.log("用时:" + (end - start) + "毫秒");
}
<input type="button" value="效率低" onclick="func1()" />
<input type="button" value="效率高" onclick="func2()" />
<script type="text/javascript">
1、字符串的拼接
字符串的拼接在我们开发中会经常遇到,所以我把其放在首位,我们往往习惯的直接用+=的方式来拼接字符串,其实这种拼接的方式效率非常的低,我们可以用一种巧妙的方法来实现字符串的拼接,那就是利用数组的join方法
//效率低的
function func1(){
var start = new Date().getTime();
var template = "";
for(var i = 0; i < 100000; i++){
template += "<input type='button' value='a'>";
}
var end = new Date().getTime();
document.getElementById("one").innerHTML = template;
console.log("用时:" + (end - start) + "毫秒");
}
//效率高的
function func2(){
var start = new Date().getTime();
var array = [];
for(var i = 0; i < 100000; i++){
array[i] = "<input type='button' value='a'>";
}
var end = new Date().getTime();
document.getElementById("one").innerHTML = array.join("");
console.log("用时:" + (end - start) + "毫秒");
}
*/
2、for循环
for循环是我们经常会遇到的情况,我们先看看下面例子:
/*
var arr = [];
for(var i = 0; i < 100000; i++){
arr[i] = "<div>" + i + "</div>";
}
document.body.innerHTML += arr.join("");
//效率低的
function func1(){
var divs = document.getElementsByTagName("div");
var start = new Date().getTime();
for(var i = 0; i < divs.length; i++){
//"效率低"
}
var end = new Date().getTime();
console.log("用时:" + (end - start) + "毫秒");
}
//效率高的
function func2(){
var divs = document.getElementsByTagName("div");
var start = new Date().getTime();
for(var i = 0, len = divs.length; i < len; i++){
//"效率高"
}
var end = new Date().getTime();
console.log("用时:" + (end - start) + "毫秒");
}
*/
以上代码已经测试 完整好使 加大循环次数,效果贴别明显
0 0
- js 代码的优化 ,完全是照搬,不过挺好使
- js apply 确实挺好的
- 如何将Anaconda更新到想要的python版本(其实使用的是Anaconda中的切换不同环境的方法,不过步骤挺好)
- QBasic代码的优化(完全版)
- 第一次照搬程序的感想
- 四个程序的代码哈,不过,前三个是小甜品,很小,练手用的
- CSS导圆角,不过这个代码没有怎么看懂,与一般的HTML是不同
- CSS导圆角,不过这个代码没有怎么看懂,与一般的HTML是不同
- iOS简单的音效播放单例 (您可照搬代码)
- 很强大的Js日历代码,包括公历和农历的节日,不过界面设计一般
- 挺好的~
- 挺好的
- 老师 感觉是四川人讲的挺好的
- 刚接触cef,这里是一篇挺好的教程
- 挺好的git别人的代码的文章
- Babel是如何读懂JS代码的
- JS日历,(万年历)功能和界面都挺好的
- 永远不要笃信标准,照搬照抄的标准不可能完全适合你的企业,不要成为标准的奴隶,量体裁衣,做标准的主人
- 穷举破解linux登录密码
- Android 简单设置Activity为dialog样式
- 蓝桥杯-扶老奶奶过街
- Android学习(5)——静态变量传值,全局变量传值以及由A-B-A的传值
- 使用veil-evasion打造免杀payload(1)
- js 代码的优化 ,完全是照搬,不过挺好使
- LVS+MYCAT读写分离+MYSQL同步部署+故障自动转移
- Missing iOS Distribution signing identity问题解决 AppleWWDRCA (Apple Worldwide Developer Relations Certi
- [菜鸟笔记]not in 优化实践问题
- 盘点:怀一胎和怀二胎的4点不同
- 小小程序员的新年愿望
- php如何获取url的参数
- poj 2456 Aggressive cows (二分+贪心思想)
- 《Effective java》读书记录-第25条-列表优先于数组