zoukankan      html  css  js  c++  java
  • 转:10个javascript简写/优化技巧

    javascript简写(JavaScript shorthand)是每一个javascript开发者必须掌握的技术,最少的代码获得最大的性能!

    1. 判断是否为空(Null, Undefined,”)

    当创建新的变量,有时你需要检查引用变量的值是否为null或undefined。

    实例:

    1. if (variable1 !== null || variable1 !== undefined || variable1 !== '') {
    2. var variable2 = variable1;
    3. }

    简写:

    1. var variable2 = variable1 || '';

    2. 对象

    实例:

    1. var a = new Array();
    2. var b = new Object();
    3. var c = new String("myString");

    简写:

    1. var a = [];
    2. var b = {};
    3. var c = "myString";

    3. 对象数组

    对象数组就是数组里的每个元素都是类的对象,赋值时先定义对象,然后将对象直接赋给数组就行了。

    实例:

    1. var a = new Array();
    2. a[0] = "myString1";
    3. a[1] = "myString2";
    4. a[2] = "myString3";

    简写:

    1. var a = ["myString1", "myString2", "myString3"];

    4. 关联数组

    关联数组类似于对象,是由无序的键 和值 组成的。关联数组使用键而不是数字索引来组织存储的值。每个键都是一个唯一的字符串,与一个值相关联并用于访问该值。值可以是数字、数组、对象等数据类型。在创建代码以查找与一个键相关联的值时,您就是在创建索引或执行查找。这可能是关联数组最常见的用途。

    实例:

    1. var skillSet = new Array();
    2. skillSet['Document language'] = 'HTML5';
    3. skillSet['Styling language'] = 'CSS3';
    4. skillSet['Javascript library'] = 'jQuery';
    5. skillSet['Other'] = 'Usability and accessibility';

    简写:

    1. var skillSet = {
    2. 'Document language' : 'HTML5',
    3. 'Styling language' : 'CSS3',
    4. 'Javascript library' : 'jQuery',
    5. 'Other' : 'Usability and accessibility'
    6. };

    不要忘记最后一组结尾是没有逗号的,不然IE浏览器会报错.

    5. 赋值运算符

    赋值运算符用于赋值到JavaScript变量,毫无疑问,你每天不假思索地使用算术(不管你用什么编程语言的Java,PHP,C++它本质上是相同的)。

    实例:

    1. x=x+1;
    2. minusCount = minusCount - 1;
    3. y=y*10;

    简写:

    1. x++;
    2. minusCount --;
    3. y*=10;

    其它运算符,定义 x=10 y=5:

    1. x += y //result x=15
    2. x -= y //result x=5
    3. x *= y //result x=50
    4. x /= y //result x=2
    5. x %= y //result x=0

    6. Regexp 对象

    RegExp 对象用于规定在文本中检索的内容

    1. /test/("is test in here")

    老外建议用正则来检索内容,似乎是从javascript性能上来考虑的,我不得而知了。

    实例:

    1. searchText = "padding 1234 rocket str austin TX 78704 more padding"
    2. /\d+.+\n{0,2}.+\s+[A-Z]{2}\s+\d{5}/m(searchText)
    3. //returns: ["1234 rocket str austin TX 78704"]

    简写:

    1. var re = new RegExp(/\d+.+\n{0,2}.+\s+[A-Z]{2}\s+\d{5}/m);
    2. re.exec(searchText);
    3. //returns: ["1234 rocket str austin TX 78704"]

    7. If语句

    这可能是微不足道的,但值得一提。在做”If判断”的时候赋值运算符有时可以省略。

    实例:

    1. if (likeJavaScript == true)

    简写:

    1. if (likeJavaScript)

    下面是另一个例子。如果a不等于true,然后…

    实例:

    1. var a;
    2. if ( a != true ) {
    3. // do something...
    4. }

    简写:

    1. var a;
    2. if ( !a ) {
    3. // do something...
    4. }

    实例:

    1. var big;
    2. if (x > 10) {
    3. big = 1;
    4. }
    5. else {
    6. big = 2;
    7. }

    简写:

    1. var big = (x > 10) ? 1 : 2;

    实例:

    1. var a, b;
    2. if ( !a ) {
    3. a = b;
    4. }

    简写:

    1. var a, b;
    2. a = a || b;

    8. JavaScript For 循环

    实例:

    1. for (var i = 0; i < allImgs.length; i++)

    简写:

    1. for(var i in allImgs)

    9. 函数变量参数

    常见的写法:

    1. function myFunction( myString, myNumber, myObject, myArray, myBoolean ) {
    2. // do something...
    3. }
    4. myFunction( "String", 1, [], {}, true )

    看看高手们的写法:

    1. function myFunction() {
    2. alert( arguments.length ); // Returns 5
    3. for ( i = 0; i < arguments.length; i++ ) {
    4. alert( typeof arguments[i] ); // Returns string, number, object, object, boolean
    5. }
    6. }
    7. myFunction( "String", 1, [], {}, true );

    虽然看上去代码变的更臃肿了,但是动态变量参数更方便维护。

    10、对象字面量

    示例:

    1. function myFunction() {
    2. this.myMethod = function() {}
    3. }
    4. var myObject = new myFunction();

    简写:

    1. var myObject = {
    2. myMethod: function() {}
    3. };
  • 相关阅读:
    Java代码的执行顺序一
    面试套路-技术需求
    常用数据库的分页实现
    真假分页优缺点
    获取一些系统和用户的通用属性
    反射的使用
    sql复制表数据的方法
    跨服务器的sql使用
    sql 随机数
    常用正则
  • 原文地址:https://www.cnblogs.com/yingzi/p/2600992.html
Copyright © 2011-2022 走看看