jQuery技术

JavaScript 开发的40个经典技巧 前端开发,JQUERY特效,全栈开发(2)

字号+ 作者:H5之家 来源:H5之家 2018-02-16 15:00 我要评论( )

逻辑或还可用来设置默认值,比如函数参数的默认值。 function doSomething(arg1){arg1 = arg1 || 10; // arg1 will have 10 as a default value if it’s not already set}使得map()函数方法对数据循环var squares

逻辑或还可用来设置默认值,比如函数参数的默认值。

function doSomething(arg1){ arg1 = arg1 || 10; // arg1 will have 10 as a default value if it’s not already set } 使得map()函数方法对数据循环 var squares = [1,2,3,4].map(function (val) { return val * val; }); // squares will be equal to [1, 4, 9, 16] 保留指定小数位数 var num =2.443242342; num = num.toFixed(4); // num will be equal to 2.4432

注意,toFixec()返回的是字符串,不是数字。

浮点计算的问题 0.1 + 0.2 === 0.3 // is false 9007199254740992 + 1 // is equal to 9007199254740992 9007199254740992 + 2 // is equal to 9007199254740994

为什么呢?因为0.1+0.2等于0.30000000000000004。JavaScript的数字都遵循IEEE 754标准构建,在内部都是64位浮点小数表示,具体可以参见JavaScript中的数字是如何编码的.

可以通过使用toFixed()和toPrecision()来解决这个问题。

通过for-in循环检查对象的属性

下面这样的用法,可以防止迭代的时候进入到对象的原型属性中。

for (var name in object) { if (object.hasOwnProperty(name)) { // do something with name } } 逗号操作符 var a = 0; var b = ( a++, 99 ); console.log(a); // a will be equal to 1 console.log(b); // b is equal to 99 临时存储用于计算和查询的变量

在jQuery选择器中,可以临时存储整个DOM元素。

var navright = document.querySelector('#right'); var navleft = document.querySelector('#left'); var navup = document.querySelector('#up'); var navdown = document.querySelector('#down'); 提前检查传入isFinite()的参数 isFinite(0/0) ; // false isFinite("foo"); // false isFinite("10"); // true isFinite(10); // true isFinite(undefined); // false isFinite(); // false isFinite(null); // true,这点当特别注意 避免在数组中使用负数做索引 var numbersArray = [1,2,3,4,5]; var from = numbersArray.indexOf("foo") ; // from is equal to -1 numbersArray.splice(from,2); // will return [5]

注意传给splice的索引参数不要是负数,当是负数时,会从数组结尾处删除元素。

用JSON来序列化与反序列化 var person = {name :'Saad', age : 26, department : {ID : 15, name : "R&D"} }; var stringFromPerson = JSON.stringify(person); /* stringFromPerson 结果为 "{"name":"Saad","age":26,"department":{"ID":15,"name":"R&D"}}" */ var personFromString = JSON.parse(stringFromPerson); /* personFromString 的值与 person 对象相同 */ 不要使用eval()或者函数构造器

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

var func1 = new Function(functionCode); var func2 = eval(functionCode); 避免使用with()

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

不要对数组使用for-in

避免:

var sum = 0; for (var i in arrayNumbers) { sum += arrayNumbers[i]; }

而是:

var sum = 0; for (var i = 0, len = arrayNumbers.length; i < len; i++) { sum += arrayNumbers[i]; }

另外一个好处是,i和len两个变量是在for循环的第一个声明中,二者只会初始化一次,这要比下面这种写法快:

for (var i = 0; i < arrayNumbers.length; i++) 传给setInterval()和setTimeout()时使用函数而不是字符串

如果传给setTimeout()和setInterval()一个字符串,他们将会用类似于eval方式进行转换,这肯定会要慢些,因此不要使用:

setInterval('doSomethingPeriodically()', 1000); setTimeout('doSomethingAfterFiveSeconds()', 5000);

而是用:

setInterval(doSomethingPeriodically, 1000); setTimeout(doSomethingAfterFiveSeconds, 5000); 使用switch/case代替一大叠的if/else

当判断有超过两个分支的时候使用switch/case要更快一些,而且也更优雅,更利于代码的组织,当然,如果有超过10个分支,就不要使用switch/case了

在switch/case中使用数字区间

其实,switch/case中的case条件,还可以这样写:

function getCategory(age) { var category = ""; switch (true) { case isNaN(age): category = "not an age"; break; case (age >= 50): category = "Old"; break; case (age

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • JQuery 在网页上实现答题功能

    JQuery 在网页上实现答题功能

    2018-02-16 11:52

  • [jQuery学习系列二 ]2

    [jQuery学习系列二 ]2

    2018-02-16 09:29

  • 19 个 JavaScript 有用的简写技术 前端开发,JQUERY特效,全栈开

    19 个 JavaScript 有用的简写技术 前端开发,JQUERY特效,全栈开

    2018-02-15 10:33

  • Jquery高效编程技巧

    Jquery高效编程技巧

    2018-02-13 16:03

网友点评