1、使用var声明变量

如果给一个没有声明的变量赋值,默认会作为一个全局变量(即使在函数内赋值)。要尽量避免不必要的全局变量。

2、行尾使用分号

虽然JavaScript允许省略行尾的分号,但是有时不注意的省略,会导致不必要的错误。建议在可用可不用行尾分号的地方加上分号。

3、获取指定范围内的随机数

var getRandom = function(max, min) {
min = arguments[1] || 0;
return Math.floor(Math.random() * (max - min + 1) + min);};

上面的函数接受一个你希望的随机最大数和一个你希望的随机最小数。

4、打乱数字数组的顺序

var sortArray = array.sort(function(){
return Math.random() - 0.5;});

5、取出数组中的随机项

var ran = array[Math.floor(Math.random() * array.length)];

6、去除字符串的首尾空格

var s = string.trim();

7、类数组对象转为数组

比如:类数组对象遍历:

Array.prototype.forEach.call(argumens,function(value){})

DOM的NodeList和HTMLCollection也是类数组对象

8、获取数组中的最大值和最小值

var max = Math.max.apply(Math, array);
var min = Math.min.apply(Math, array);

9、清空数组

array.length = 0;
array = [];

10、保留指定小数位

var num = num.toFixed(2);

返回字符串,保留两位小数

11、使用for-in循环来遍历对象的属性

for(var key in object) {
// object[key]}

不要用for-in来遍历数据

12、获取某月天数

function getMonthDay(date){
date = date || new Date();
if(typeof date === 'string') {
date = new Date(date);
};
date.setDate(32);
return 32 - date.getDate();}

传入date参数,可以是字符串、日期对象实例;为空表示当月天数

13、浮点数问题

0.1 + 0.2 = 0.30000000000000004 != 0.3

JavaScript的数字都遵循IEEE 754标准构建,在内部都是64位浮点小数表示

14、JSON序列化和反序列化

使用JSON.stringify()来将JavaScript对象序列化为有效的字符串。
使用JSON.parse()来将有效的字符串转换为JavaScript对象。

在AJAX传输数据时很有用

15、使用“===”替换“==”

相等运算符(==)在比较时会将操作数进行相应的类型转换,而全等运算符(===)不会进行类型转换。

16、避免使用with()

使用with()可以把变量加入到全局作用域中,因此,如果有其它的同名变量,一来容易混淆,二来值也会被覆盖。

17、不要使用eval()或函数构造器

eval()和函数构造器(Function consturctor)的开销较大,每次调用,JavaScript引擎都要将源代码转换为可执行的代码。

18、简化if语句

if (condition) {
fn();}

可替换成:

condition && fn();

19、给可能省略的参数赋默认值

function test(a, b){
a = a || '1';}

20、给数组循环中缓存length的值

如果你确定循环中数组的长度不会变化,那么你可以这样:

var length = array.length;for(var i = 0; i < length; i++) {}

可以避免在每次迭代都将会重新计算数组的大小,提高效率

21、合并数组

对于小数组,我们可以这样:

var arr1 = [1,2,3];var arr2 = [4,5,6];
var arr3 = arr1.concat(arr2); // [1,2,3,4,5,6]

不过,concat()这个函数并不适合用来合并两个大型的数组,因为其将消耗大量的内存来存储新创建的数组。在这种情况之个,可以使用Array.prototype.push.apply(arr1,arr2)来替代创建一个新数组。
这种方法不是用来创建一个新的数组,其只是将第一个第二个数组合并在一起,同时减少内存的使用:

Array.prototype.push.apply(arr1, arr2);
console.log(arr1); // [1,2,3,4,5,6]

22 枚举对象“自身”的属性

for...in除了枚举对象“自身”的属性外,还会枚举出继承过来的属性。

var hasOwn = Object.prototype.hasOwnProperty;
var obj = {name: 'tg', age: 24};for(var name in obj) {
if (hasOwn.call(obj, name)) {
console.log(name + ':' + obj[name]);
}}// name:tg// age:24

22条常用JavaScript开发小技巧的更多相关文章

  1. JavaScript开发小技巧

    总结一些能够提高开发效率的JS技巧 1.过滤唯一值 Set类型是在ES6中新增的,它类似于数组,但是成员的值都是唯一的,没有重复的值.结合扩展运算符(...)我们可以创建一个新的数组,达到过滤原数组重 ...

  2. 【前端】javascript中10常用的个小技巧总结

    javascript中10常用的个小技巧总结 本文转自:http://www.cnblogs.com/libin-1/p/6756393.html 1. new Set() 可能有人知道ES6中提供了 ...

  3. 移动Web开发小技巧

    移动Web开发小技巧 添加到主屏后的标题(IOS) name="apple-mobile-web-app-title" content="标题"> 启用  ...

  4. BizTalk开发小技巧

    BizTalk开发小技巧 随笔分类 - Biztalk Biztalk 使用BizTalk实现RosettaNet B2B So Easy 摘要: 使用BizTalk实现RosettaNet B2B ...

  5. Windows统一平台: 开发小技巧

    Windows统一平台: 开发小技巧 技巧一: 在手机端拓展你应用的显示区域.(WP8.1中也适用) 对于Windows Phone系统的手机, 手机屏幕最上方为系统状态栏(System Tray), ...

  6. flex开发小技巧集锦

    关于flex开发网上有非常多的相关信息介绍,因此我们要想学习关于flex开发的知识信息技能是一件非常简单和方便的事情.而针对于flex开发小编要告诉大家的是一些flex开发小技巧.利用这些小技巧能够有 ...

  7. TP开发小技巧

    TP开发小技巧原文地址http://wp.chenyuanzhao.com/wp/2016/07/23/tp%E5%BC%80%E5%8F%91%E5%B0%8F%E6%8A%80%E5%B7%A7/ ...

  8. Java开发小技巧(三):Maven多工程依赖项目

    前言 本篇文章基于Java开发小技巧(二):自定义Maven依赖中创建的父工程project-monitor实现,运用我们自定义的依赖包进行多工程依赖项目的开发. 下面以多可执行Jar包项目的开发为例 ...

  9. iOS开发小技巧 - UILabel添加中划线

    iOS开发小技巧 遇到的问题: 给Label添加中划线,然后并没有效果 NSString *str = [NSString stringWithFormat:@"合计金额 ¥%.2f&quo ...

随机推荐

  1. UnicodeEncodeError: 'gbk' codec can't encode character '\xa0' in position 263: i llegal multibyte sequence

    UnicodeEncodeError: 'gbk' codec can't encode character '\xa0' in position 263: illegal multibyte seq ...

  2. OpenCL + OpenCV 图像旋转

    ▶ 使用 OpenCV 从文件读取彩色的 png 图像,旋转一定角度以后写回文件 ● 代码,核函数 // rotate.cl //__constant sampler_t sampler = CLK_ ...

  3. Node fs, url, http 组合小型的服务器 ( 满足html请求, get, post 传值 )

    <script type="text/javascript"> /* * 引入模块 */ var http = require('http'); var url = r ...

  4. ASP.net显示当前系统在线人数

    void Application_Start(object sender, EventArgs e) { // 在应用程序启动时运行的代码 Application.Lock(); if (Applic ...

  5. eval是只读数据,bind是可更新的.

    1.Eval和Bind的区别  绑定表达式  <%# Eval("字段名") %>  <%# Bind("字段名") %> Eval(& ...

  6. 进程和创建线程的两种方法(threading.Thread)

    进程 如QQ 要以一个整体的形式暴露给操作系统管理,里面包含对各种资源的调用,内存的管理, 网络接口的调用等,进程就是各种资源管理的集合 线程:是操作系统最小的调度单位,是一串指令的结合 进程 要操作 ...

  7. MVC中数据传递 ViewBag的使用

    ViewBag MVC3中 ViewBag.ViewData和TempData的使用和差别 在MVC3開始.视图数据能够通过ViewBag属性訪问.在MVC2中则是使用ViewData.MVC3中保留 ...

  8. 关于eval()函数处理后台返回的json数据

    对于服务器返回的JSON字符串,如果jquery异步请求没做类型说明,或者以字符串方式接受,那么需要做一次对象化处理,方式不是太麻烦,就是将该字符串放于eval()中执行一次.这种方式也适合以普通ja ...

  9. docker 入門

    http://dockone.io/article/277 我的碎碎念:Docker入门指南 [编者的话]之前曾经翻译过很多Docker入门介绍的文章,之所以再翻译这篇,是因为Anders的角度很独特 ...

  10. jps command not found已解决

    根据当前版本安装devel 包 eg: yum install java--openjdk-devel -y jdk小工具jps介绍 jps(Java Virtual Machine Process ...