zoukankan      html  css  js  c++  java
  • 201506150846_《JavaScript权威指南(第六版)——性能优化10条、小写转大写、过滤、函数》(P162-168)

    一. 权威指南

    1. 对于类数组对象,我们不能用数组方法,但是我们可以用 Function.call();

       例如: Array.prototype.slice.call(arr,...);

                Array.prototype.silice.call(arr,...);

                Array.prototype.map.call(arr,...);

    二. 性能优化10条

    1.  var someId = document.getElementById('#someElem');  改成:  var docu = document, someId = docu.getElementById('#someElem'); 

    2. 不要用with();

    3. 小心使用闭包,尤其在循环中;

    4. 在数值、变量、对象属性和数组元素4种访问方式中,前二者的速度显著优于后二者;

    5. 不要在数组中挖掘的太深;

    6. 用for();或do-while来代替 for-in;

    7. 在循环时,将循环条件和循环变量合并起来;

    8. 为HTML集合对象定义数组;(推荐使用《高性能JavaScript作者的写法》)

       例如: function array(items) {

        try {

      return

      Aarray.prototype.concat.call(items);

    }catch(ex) {

      var i = 0,

        len = items.length,

        result = Array(len);   

          while(i < len) {

                  result[i] = items[i];

          i++;

    }

        return result;

      }

    }

    var docu = document;

    var divs = array(docu.getElementByTagName('div'));

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

      var myDiv = docu.creatElement("div");

          docu.appendChild("myDiv ");

    }

    9. 不要碰Dom ! 

    crateAttribute(name);       

    createComment(text);       

    createDocumentFragment(); (推荐用法)  

    createElement(tagname);      

    createTextNode(text);

    10. 修改css类而非样式

    三. 小写转大写

    例如:

    var str = ['a', 'p', 'p', 'l', 'e', 's'];

    Array.map = Array.map || function(a,sep) {return Array.prototype.map.call(a,sep)};
    var newStr = Array.map(str,function(elem){return elem.toUpperCase()});
    console.log(newStr);

    四. 过滤

    例如:

    var s = "fsdgnxvhdzfgtrxzcsdightmjtioyujvdgs";
    var newS = Array.prototype.join.call(s," ");

    console.log(newS);  //f s d g n x v h d z f g t r x z c s d i g h t m j t i o y u j v d g s

    var lastestS = Array.prototype.filter.call(newS,function(elem){return elem.match(/[^aeiou]/);}).join("");

    console.log(lastestS);  //fsdgnxvhdzfgtrxzcsdghtmjtyjvdgs

    注意:字符串是不变的,不可修改的(比较特殊),使用push()、sort()、reverse()方法会修改数组,但是对字符串无效!!

    五. 函数

    1. 初始化一个对象的函数成为构造函数(constructor)。

    2. 定义函数有两种方式:a. 定义语句  b. 表达式

    3.  例1:遍历对象属性名和属性

    var object = {'a' : '3','str' : 'hello','funcion' : 'fn','b' : '0.618'};

      function printProps(obj) {for(var p in obj)console.log(p + " : " + obj[p] + " ")};

       printProps(object);   //

                                         //a : 3

                                         // str : hello

                                         // funcion : fn

                                         // b : 0.618

       例2:计算两个坐标简的距离

       function distance(x1,x2,y1,y2) {

      var dx = x2-x1;

          var dy = y2-y1;

      return Math.sqrt(dx*dx + dy*dy);

    };

    distance(0,0,2.8,55); //0?

    例3:阶乘

    function factorial(n) {

    if(n <= 1){

    return 1;

      }else{

    return

      n*factorial(n-1)

      }

    };

    factorial(4);  //24

    4. 函数的名称将是函数内部的一个局部变量;

    5. 没有返回值的函数有时候成为“过程”;

    6. 注意:x可以访问a,b!!

    例如:

    function fn_a(a,b){

            function fn_b(x) {

        return x*x;

        }

    return Math.sqrt(fn_b(a) + fn_b(b));

    }

    7. 函数表达式可以出现在JavaScript代码的任何地方

    六.函数调用

    1. 作为函数调用、作为方法调用,作为构造函数调用、call()和apply()间接调用;

    2. 

    前端-语言
  • 相关阅读:
    sqlalchemy的orm的高级用法,分组,排序,聚合等方法
    flask的SQLAlchemy,连接数据库的增删改查操作
    wtforms的form表单的高级用法
    初始wtforms表单,以及简单使用
    命令启动flask以及自定义命令
    MySQL5.5安装教程
    Java设计模式-策略模式实际应用场景
    Java设计模式-策略模式详解
    Oracle数据库之FORALL与BULK COLLECT语句
    代理模式详解(静态代理和动态代理的区别以及联系)
  • 原文地址:https://www.cnblogs.com/beesky520/p/4578585.html
Copyright © 2011-2022 走看看