JavaScript中的一些特殊用法(三)

阅读《2024 中国开源开发者报告》赢大奖，扫码申请享特权

1. ==和===

在JavaScript中，如果等式两边类型不同，或者仅包含一个对象，那么比较会分为两种情况，转型后比较和不转型直接比较。 ==是先转换在比较，===是不转换直接比较。 对于来说===，只要类型不相等就返回false。 而对于==来说，分为如下几种情况：

• true会转换为1，false会转换为0。
• 字符串和数值比较，字符串会转换为数值。
• 如果等式两边只有一个对象，这个对象会调用valueOf得到基本类型，如无valueOf方法调用toString方法。如果两边都是对象则不转型。

  var p = {
     "name":"a"
  };
  var q = {
      "name":"a"
  }
  var o =p;
  alert(q==p);    //false   p和q指向的对象的地址不同,虽然对象的内容是相同的
  alert(o==p);    //true

• 下面是特殊的比较情况

  null == undefined   //true
  NaN != NaN          //true
  NaN == NaN          //false
  "NaN"  == NaN       //false
  undefined == 0      //false
  null == 0           //false

2. for-in语句

• for-in语句输出顺序不可预测，次序可能因为浏览器不同而有所差异。
• 要迭代的变量未null或undefined时，ECMAScript 5下不再抛出错误而是不执行循环体。如果想向前兼容，则在循环前判断不为null或undefined。

3. swithc语句

• switch可以使用任何数据类型。
• case的值可以是常量，变量和表达式。
• switch语句在比较值时使用的是全等比较操作符(===)。

  var num = 25;
  switch (true) {
    case num<0:
      alert("less 0");
      break;
    case num>=0:
      alert("more than 0");
      break;
    default:
      alert("error");

  }

4. 函数的使用

• 函数内没有return语句或return不带任何返回值，则函数都会返回undefined。
• 函数的定义时和函数的调用时参数不比保持一致。换句话说两种参数(形参和实参)并没有任何联系。函数定义时提供的变量只是使用时较为方便，就算不定义也可以获得传递给函数的参数(通过arguments[])。

  function howManyArgs(){
    alert(arguments.length);
  }
  howManyArgs("a");         // 1
  howManyArgs("a","b");     // 2
  howManyArgs();            // 0

• 形参和arguments[]之间的关系如下，注意严格模式和非严格模式区别。

  function howManyArgs(ss){
    arguments[0]="test";
    arguments[1]="test2"
    alert(arguments[0]);    //test
    alert(arguments[1]);    //test2
    alert(ss);              //test
  }
  howManyArgs("a");

function howManyArgs(ss){
  "use strict"
  arguments[0]="test";
  arguments[1]="test2"
  alert(arguments[0]);      //test
  alert(arguments[1]);      //test2
  alert(ss);                //a
}
howManyArgs("a");

5. 函数参数的使用

在定义函数时，我们会把用到的参数写到函数的括号内，但是在有多个可选参数的情况下就会不够灵活，这个时候可以使用对象封装多个可选参数。

  function displayInfo(args){
    var output = "";
    if (typeof args.name == "string"){
      output += "Name: " + args.name + "\n";
    }
    if(typeof args.age == "number"){
      output += "Age: "args.age + "\n";
    }
    alert(output);
  }
  displayInfo({
    name: "Nicholas",
    age: 29
  });
  displayInfo({
    name: "Greg"
  });

6. 数组长度

• 数组每一项可以保存任何数据类型(a[0]的类型可以和a[1]的不同)
• 数组的length属性可变，可以调整length的长度动态的改变数组大小。

  var colors = ["red", "blue", "green"];
  alert(colors.length);     //3
  colors.length = 2;
  alert(colors[2]);         //undefined
  colors.length=5;
  alert(colors[2]);        //undefined colors[2]信息已经丢失

7. 检测数组

if (value instanceof Array)是我们常用来判断一个变量是不是数组类型，但是此代码假定只有一个全局环境。如果网页包含多个框架，就会存在两个版本的Array构造函数，框架之间传递数组判断时会出现问题。我们可以用ECMAScript 5中的Array.isArray(yourValue)方法。

  var arr=new Array();
  alert(typeof(arr));       //object
  alert(arr instanceof Array);   // true
  var iframe = document.createElement('iframe');    
  document.body.appendChild(iframe);    
  xArray = window.frames[1].Array;       
  var arr = new xArray();   
  alert(arr instanceof Array); // false
  alert(arr.constructor === Array); // false
  alert(Array.isArray(arr)) ;       //true

8. 数组的常用方法

• 栈方法
  • push() 在数组末尾添加一项
  • pop() 从数组末尾弹出一项
• 队列方法
  • push()
  • shift() 从数组开始弹出一项
• 反向对列 (数组的前端添加，末尾移除)
  • unshift() 从数组开始添加若干项
  • pop()

  var colors = new Array();
  colors.push("red","green");
  var item = colors.pop();
  alert(item);      // green
  colors.push("green"); // 将弹出的green重新放回
  var item = colors.shift();
  alert(item);      //red
  colors.unshift("red");  //将弹出的red重新放回
  alert(colors)         // red, green

• sort() sort()方法按升序排列，会调用数组每项的toString()方法，然后比较字符串，即使是数值也转为字符串。
• slice() 方法返回输入参数到数组结尾的所有项，不会影响原数组，如果两个参数，则返回两个参数间的数组，不包括开始位置。
• indexOf()/lastIndexOf() 接受要查找的项，和起点索引(可选)两个参数，比较时使用全等操作符(===)。
• reduce()和reduceRight() 会把数组前一项运行函数的返回值当做下一个数组项的输入值，最后只返回一个结果

  var values = [1,2,3,4,5];
  var sum = values.reduce(function(prev,cur,index,array){
    return prev + cur;
  });
  alert(sum) //1+2+3+4+5=15
  /* 第一次执行回调函数prev是1，cur是2
   * 第二次prev是3，cur是3
   * 第三次prev是6，cur是4
   * 第四次prev是10，cur是5
   * 返回10+5=15
   */

9. 数组的迭代方法

• every() 对数组中每一项运行一个函数，数组每一项都返回true，则every()返回true。
• filter() 对数组中每一项运行一个函数，filter()返回数组中所有返回true的项。
• forEach() 对数组中每一项运行一个函数。
• map() 对数组中每一项运行一个函数，map()返回数组每一项执行函数的返回值组成的数组。
• some() 对数组中每一项运行一个函数，只要有一个数组项返回true，则some()返回true。

  var numbers = [1,2,3,4,5,4,3,2,1];

  var everyResult = numbers.every(function(item,index,array){
    return item>2;
  });
  alert(everyResult);   //false

  var filterResult = numbers.filter(function(item,index,array){
    return (item>2);
  });
  alert(filterResult);      //[3,4,5,4,3]

  var mapResult = numbers.map(function(item,index,array){
    return items*2;
  });
  alert(mapResult);   //[2,4,6,8,10,8,6,4,2]

  var someResult = numbers.some(function(item,index,array){
    return item>2;
  });
  alert(someResult);    //true

  numbers.forEach(function(item,index,array){
    alert(item)                                   // 1,2,3,4,5,4,3,2,1
  });