1. 给参数赋默认值

//通常写法
function dateRender(format){
if(format){
format = 'Y-m-d';
}
// code
} //强推
function dateRender(format){
format = format || 'Y-m-d'; // code
}

2. 多个参数的函数,可以使用对象代替

function save(name, sex, age) {
name = name || '';
sex = sex || 'female';
age = age || 0;   // code
} function save(person) {
person = person || {};
var name = person.name || '';
var sex = person.sex || 'female';
var age = person.age || 0;   // code
}

3. 使用 === 代替 ==

==(或者!=)做对比的时候会将进行对比的两者转换到同一类型再比较。===(或者!==)则不会,他会将进行对比的两者做类型对比和值对比,相对于 == ,=== 的对比会更加严谨。

"" == false // true
"" === false // false

4. 变量转换

1)string to number

var pi = '123';
var pi_num1 = +pi; // 123
var pi_num2 = 1*pi; // 123
var pi_num3 = ~~pi; //123

2)string/number to bool

3) string to array

直接在字符串上加 [].

5. 清空/截短一个数组

6. 利用闭包给回调函数传递参数: 详细说明

// 1)延时函数
function fun1(arg){
return function(){console.dir(arg);}
}
var test=fun1('hello');//返回f3的内部函数的引用
setTimeout(test,100); //这里直接传递fun1是不正确的 // 2)方法注册 document.getElementById("hello").onclick=test;//正确, document.getElementById("hello").attachEvent("onclick",test);//正确,

7. 记录代码块的执行时间,性能调试时有用。

8. 检查一个对象是否有属性

var myObject = {
name: '@tips_js'
};
myObject.hasOwnProperty('name'); // true
'name' in myObject; // true
myObject.hasOwnProperty('valueOf'); // false, valueOf 是从原型链继承的
'valueOf' in myObject; // true

9. 使用for-in遍历一个对象内部属性的时候注意检查属性

下面的代码片段能够避免在遍历一个对象属性的时候访问原型的属性

for (var name in object) {
if (object.hasOwnProperty(name)) {
// do something with name
}
}

10. "use strict" 和懒惰

严格模式的JavaScript让开发人员更加安全的编写JavaScript。
默认情况下,JavaScript允许开发者懒惰,例如,我们在第一次声明变量的时候可以不用var,虽然这可能看起来像一个没有经验的开发人员,同时这也是很多错误的根源,变量名拼写错误或意外地将它提到了外部作用域。

程序员喜欢让电脑为我们做些无聊的事,检查一些我们工作的错误。"use strict"指令我们做这些,将我们的错误转换成JavaScript的错误。

我们将一些较大的JavaScript项目中的不良行为直接在JavaScript引擎执行中禁止了。在其他情况中,严格模式改变以下的行为:

· 变量只有在前面 var 声明了才能用
· 试图写入只读属性产生的误差
· 必须用 new 关键字调用构造函数
· this 不会默认指向全局对象
· 非常有限的使用eval()
· 保护保留字符或未来保留字符不被作为变量名使用

11. 处理一个数组或单个元素作为参数的方法

相比于写个单独的方法去分别操作一个数组和一个元素作为参数的函数,更好的是写一个通用的函数,这样就都可以操作。这类似于一些jQuery的方法(css匹配将修改所有的选择器)。
你仅需要先将一切放进数组,Array.concat会接收数组或单一的对象:

function printUpperCase(words) {
var elements = [].concat(words);
for (var i = 0; i < elements.length; i++) {
console.log(elements[i].toUpperCase());
}
}

12. 改善嵌套条件

但我们必须避免在每一个条件下进行多次检查,尽量避免使用switch。我们也必须考虑到最有效的方法是通过一个object。

var colorObj = {
'black': printBlackBackground,
'red': printRedBackground,
'blue': printBlueBackground,
'green': printGreenBackground,
'yellow': printYellowBackground
}; if (color in colorObj) {
colorObj[color]();
}
 

Javascript实用技巧的更多相关文章

  1. javascript实用技巧、javascript高级技巧

    字号+作者:H5之家 来源:H5之家 2016-10-31 11:00 我要评论( ) 三零网提供网络编程. JavaScript 的技术文章javascript实用技巧.javascript高级技巧 ...

  2. 【JavaScript实用技巧(二)】Js操作DOM(由问题引发的文章改版,新人大佬都可)

    [JavaScript实用技巧(二)]Js操作DOM(由问题引发的文章改版,新人大佬都可!) 博客说明 文章所涉及的资料来自互联网整理和个人总结,意在于个人学习和经验汇总,如有什么地方侵权,请联系本人 ...

  3. JavaScript 实用技巧和写法建议

    1.前言 从大学到现在,接触前端已经有几年了,感想方面,就是对于程序员而言,想要提高自己的技术水平和编写易于阅读和维护的代码,我觉得不能每天都是平庸的写代码,更要去推敲,去摸索和优化代码,总结当中的技 ...

  4. javascript实用技巧,js小知识

    一.js整数的操作 使用|0和~~可以将浮点转成整型且效率方面要比同类的parseInt,Math.round 要快,在处理像素及动画位移等效果的时候会很有用.性能比较见此. var foo = (1 ...

  5. JavaScript实用技巧总结

    前言 总结一下最近接触到的JavaScript语法糖,与大家共享. 每块糖都有详细的说明和示例,就不多说了. 准确的类型检查 /* * @function: * 类型检查示例 * 通过此方法,可以检查 ...

  6. 41个Web开发者必须收藏的JavaScript实用技巧

    1. 将彻底屏蔽鼠标右键 oncontextmenu=”window.event.returnValue=false” < table border oncontextmenu=return(f ...

  7. JavaScript 实用技巧

    1数组中删除重复 let arr = [1,2,4,3,6,4] Array.from(new Set(arr)) // es6中 .from()[1,2,4,3,6] [...new Set(arr ...

  8. 12个十分实用的JavaScript小技巧

    12个非常实用的JavaScript小技巧 在这篇文章中将给大家分享12个有关于JavaScript的小技巧.这些小技巧可能在你的实际工作中或许能帮助你解决一些问题. 使用!!操作符转换布尔值 有时候 ...

  9. 实用Javascript调试技巧

    摘要: 高效调试JS代码. 原文:实用Javascript调试技巧分享 作者:MudOnTire Fundebug经授权转载,版权归原作者所有. 见过太多同学调试Javascript只会用简单的con ...

随机推荐

  1. git学习——<四>git版本管理

    一.git版本管理的优势 都说git比svn强大,强大在哪呢? 首先,从部署上说:svn.cvs都是集中式的,一台服务器上部署服务,所有客户端编写的代码都要提交到该服务器上.git是分布式的,所有人都 ...

  2. var 声明变量的变量提升问题(let/const)

    在ES6之前,JavaScript没有块级作用域(一对花括号{}即为一个块级作用域),只有全局作用域和函数作用域.变量提升即将变量声明提升到它所在作用域的最开始的部分.既全局变量. <scrip ...

  3. 进程Process之join、daemon(守护)、terminate(关闭)

    一.Process 参数介绍: 1 group参数未使用,值始终为None 2 target表示调用对象,即子进程要执行的任务 3 args表示调用对象的位置参数元组,args=(1,2,'a',) ...

  4. maya布料预设解析

    今天做了一天布料.数值都是自己在那调整.结果发现maya自带预设,基本有些都不用调整,直接预设,效果非常不错.累死累活半天. 下来看看  预设 解析吧 ncloth新布料系统是 Maya 8.0 后新 ...

  5. java-mybaits-00601-查询缓存-一级缓存、二级缓存

    1.什么是查询缓存 mybatis提供查询缓存,用于减轻数据压力,提高数据库性能. mybaits提供一级缓存,和二级缓存. 一级缓存是SqlSession级别的缓存. 在操作数据库时需要构造 sql ...

  6. 前端黑客之XSS、CSRF

    XSS:跨站脚本,发生在目标网站中目标用户的浏览器层面上,当用户浏览器渲染整个HTML文档的过程中出现了不被预期的脚本指令并执行时,XSS就会发生. 绝大多数XSS攻击都会采用嵌入一段远程或者第三方域 ...

  7. C语言中的extern

    extern: 这个关键字真的比较恶心,在定义变量的时候,extern居然可以被省略(定义时,默认均省略): 在声明变量的时候,extern必须加在变量前. 所以有时候你搞不清楚是声明还是定义.:变量 ...

  8. iOS学习之flappyBird游戏的实现

    导言 在本人还是学生的时候,flappyBird这款游戏非常火爆,最后等到Android版的出来之后,也是很痴迷的玩了一把.可是,本人游戏天赋一直平平,几度玩得想摔手机.本文主要介绍如何开发iOS平台 ...

  9. JQuery点击标题实现div的收缩

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  10. 进度条Demo

    package threadAndRunnable; import java.awt.BorderLayout; import javax.swing.JFrame; import javax.swi ...