JavaScript数据类型转换的注意事项

2019-11-20 09:22:32

字体：大中小

来源：转载

供稿：网友

1.字符串的不可变性

　　字符串定义了后，会一直占据内存空间，企鹅该处内存空间（栈）不可被重新赋值。

2.短路运算

　　||、&& 二元运算符，返回参与运算的操作数的原值（原数据类型和原数据），

　　运算结束后，返回导致运算结束的那个操作数。

3.三元运算符

　　code1？code2：code3; 与if-else 不同：

　　返回code2或code3的值----code2，code3 都可以空的{}代替；

　　　　　　　　　　　　　不能写break，continue。

4.NaN

　　NaN ！=NaN，

　　任何NaN参与的数学运算，其结果都是NaN

　　有NaN参与的条件表达式: 比较运算符 >/>=/</<=/==/=== 运算结果为false

　　　　　　　　　　　　　　　　　　　　　！==/！= 　　　　　　运算结果为true

<script>  var a;  console.log(Boolean(NaN>=4));  console.log(Boolean(NaN<4));  console.log(Boolean(NaN=4));  console.log(Boolean(NaN==4));  console.log(Boolean(a=4));  console.log(NaN);  console.log(a);  if(NaN==NaN){    a = "NaN==NaN";  }  var b;  if(NaN!==NaN){    b = "NaN!=NaN";  }  console.log(a+"/n"+b);</script>

5. JS 简单数据类型的转换---特殊情况演示
　　数据：0，“”，false，null，undefined,"123abc"等

<!DOCTYPE html><html><head lang="en">  <meta charset="UTF-8">  <title></title>  <style>    div {      line-height: 24px;      margin: 0;      padding: 0;    }    .one {      width: 920px;      position: absolute;      left: 50%;      top: 50%;      margin-left: -460px;      margin-top: -240px;    }    .all {      float: left;      border: 2px solid #000000;    }    .all-top {      font-size: 20px;      font-weight: bold;    }    .all-bottom {      line-height: 48px;      font-size: 16px;    }    .details {      float: left;      border: 2px solid #000000;      line-height: 24px;      margin-left: -2px;    }    .details:hover {      position: relative;      border: 2px solid #ff0000;    }    .line-long {      border-top: 2px solid #000000;      height: 0;      width: 908px;    }    .line-short {      border-top: 2px dashed #000000;      height: 0;      width: 742px;      margin-left: 166px;    }  </style>  <script>    document.write("<div class='one'>");    function f1() {      return typeof res[res.length - 1];    }    var arr = [0, "", false, null, undefined, NaN, 6.66, -9, "abc124", "-12.23abc23", "qwer", "s s"];    document.write("<div class='all'><div class='all-top'>" + "  原数据及类型" + "</br>" + "转换方法  </div>" + "<div class='all-bottom'>" + "+" + "</br>" + "Number()" + "</br>" + "parseInt()" + "</br>" + "parseFloat()" + "</br>" + "/"/"" + "</br>" + ".toString" + "</br>" + "String()" + "</br>" + "!!" + "</br>" + "Boolean()" + "</br>" + "</div></div>")    for (var i = 0; i < arr.length; i++) {      switch (true) {        case arr[i] === "":        {          var res = ['""'];          break;        }        default :        {          var res = [arr[i] + ""];        }      }      res[res.length] = typeof arr[i];      res[res.length] = +arr[i];      res[res.length] = f1();      res[res.length] = Number(arr[i]);      res[res.length] = f1();      res[res.length] = parseInt(arr[i]);      res[res.length] = f1();      res[res.length] = parseFloat(arr[i]);      res[res.length] = f1();      res[res.length] = arr[i] + "";      res[res.length] = f1();      if (i == 3 || i == 4) {//null 和undefined没有.toString()方法，导致报错        res[res.length] = "报错";        res[res.length] = "报错";      } else {        res[res.length] = (arr[i]).toString();        res[res.length] = f1();      }      res[res.length] = String(arr[i]);      res[res.length] = f1();      res[res.length] = !!arr[i];      res[res.length] = f1();      res[res.length] = Boolean(arr[i]);      res[res.length] = f1();      var resString = res.join("<br>");      document.write("<div class='details'>" + resString + "</br>" + "</div>");    }    var j = 22;    for (var i = 0; i < 9; i++) {      document.write("<div class='line-short' style='margin-top:" + j + "px'></div>")      document.write("<div class='line-long' style='margin-top:" + j + "px'></div>")    }    document.write("</div>");  </script></head><body></body></html>

以上就是本文给大家分享的全部内容了，希望大家能够喜欢

上一篇：图解prototype、proto和constructor的三角关系

下一篇：关于JavaScript 原型链的一点个人理解