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. Java8 新特性之Lambda表达式

    1. Lambda 表达式概述 Lambda 是一个匿名函数,我们可以把 Lambda 表达式理解为是一段可以传递的代码(将代码像数据一样进行传递); Lambda 表达式可以写出更简洁,更灵活的代码 ...

  2. 重点:怎样正确的使用QThread类(很多详细例子的对比,注意:QThread 中所有实现的函数是被创建它的线程来调用的,不是在线程中)good

    背景描述: 以前,继承 QThread 重新实现 run() 函数是使用 QThread唯一推荐的使用方法.这是相当直观和易于使用的.但是在工作线程中使用槽机制和Qt事件循环时,一些用户使用错了.Qt ...

  3. 【我的Android进阶之旅】快速创建和根据不同的版本类型(Dev、Beta、Release)发布Android 开发库到Maven私服

    前言 由于项目越来越多,有很多公共的代码都可以抽取出一个开发库出来传到公司搭建好的Maven私服,以供大家使用. 之前搭建的Maven仓库只有Release和Snapshot两个仓库,最近由于开发库有 ...

  4. ansible(1)

    一.初识ansible 1.准备工作: 准备四台干净的虚拟机,如下: 192.168.133.129(主控节点,下面三个为被控节点) 192.168.133.130 192.168.133.131 1 ...

  5. (0.1)windows下的mysql配置使用步骤

    目录 1.基于windows平台的mysql项目场景 2.mysql数据库运行环境准备 3.下载mysql 4.通过Installer方式(即msi方式)安装mysql 5.卸载mysql ————— ...

  6. Installshield 宏定义控制版本

    定义宏 在Build =>Setting => 以空格为准定义宏 使用宏 在方法里 #if 宏名称 代码 #else 代码 #endif

  7. PSR-2 代码风格规范

    https://blog.csdn.net/qq_28602957/article/details/52248239 这篇规范是PSR-1(基本代码规范)的扩展和继承. 本规通过制定一系列规范化PHP ...

  8. HTML5游戏开发系列教程5(译)

    原文地址:http://www.script-tutorials.com/html5-game-development-lesson-5/ 最终我决定准备下一篇游戏开发系列的文章,我们将继续使用can ...

  9. Protobuf 数据类型

    .proto Type   Notes C++ Type Java Type double    double  double float    float  float int32 Uses var ...

  10. 003-spring boot项目的项目属性配置

    一.application.properties文件. 1.项目的配置文件内容.配置了端口,超时连接时间, 2.控制器. 3.访问. 二.application.yml文件 1.application ...