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


Posted in Javascript onJuly 31, 2016

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>

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

Javascript 相关文章推荐
this[] 指的是什么内容 讨论
Mar 24 Javascript
js 实现css风格选择器(压缩后2KB)
Jan 12 Javascript
浅谈Node.js:Buffer模块
Dec 05 Javascript
javascript DOM的详解及实例代码
Mar 06 Javascript
详解JS中遍历语法的比较
Apr 07 Javascript
jQuery封装placeholder效果实现方法,让低版本浏览器支持该效果
Jul 08 jQuery
ReactJs实现树形结构的数据显示的组件的示例
Aug 18 Javascript
基于javascript 显式转换与隐式转换(详解)
Dec 15 Javascript
Vue+Element实现表格编辑、删除、以及新增行的最优方法
May 28 Javascript
用JS实现一个简单的打砖块游戏
Dec 11 Javascript
JS实现前端动态分页码代码实例
Jun 02 Javascript
js实现筛选功能
Nov 24 Javascript
关于JavaScript 原型链的一点个人理解
Jul 31 #Javascript
jquery实现界面无刷新加载登陆注册
Jul 30 #Javascript
AngularJS ng-change 指令的详解及简单实例
Jul 30 #Javascript
Javascript中级语法快速入手
Jul 30 #Javascript
AngularJS ng-blur 指令详解及简单实例
Jul 30 #Javascript
AngularJS ng-bind-template 指令详解
Jul 30 #Javascript
AngularJS ng-bind-html 指令详解及实例代码
Jul 30 #Javascript
You might like
《PHP边学边教》(02.Apache+PHP环境配置――下篇)
2006/12/13 PHP
PHP mkdir()定义和用法
2009/01/14 PHP
php读取EXCEL文件 php excelreader读取excel文件
2012/12/06 PHP
php将日期格式转换成xx天前的格式
2015/04/16 PHP
php解析url并得到url中的参数及获取url参数的四种方式
2015/10/26 PHP
php中bind_param()函数用法分析
2017/03/28 PHP
PHP实现数据四舍五入的方法小结【4种方法】
2019/03/27 PHP
使用prototype.js 的时候应该特别注意的几个问题.
2007/04/12 Javascript
javascript一个无懈可击的实例化XMLHttpRequest的方法
2010/10/13 Javascript
一个JavaScript去除字符串末尾的空白实例代码
2014/09/22 Javascript
ie8模式下click无反应点击option无反应的解决方法
2014/10/11 Javascript
js中的事件捕捉模型与冒泡模型实例分析
2015/01/10 Javascript
js实现鼠标划过给div加透明度的方法
2015/05/25 Javascript
jQuery插件bgStretcher.js实现全屏背景特效
2015/06/05 Javascript
探析浏览器执行JavaScript脚本加载与代码执行顺序
2016/01/12 Javascript
jQuery easyui的validatebox校验规则扩展及easyui校验框validatebox用法
2016/01/18 Javascript
Jquery EasyUI实现treegrid上显示checkbox并取选定值的方法
2016/04/29 Javascript
纯js实现html转pdf的简单实例(推荐)
2017/02/16 Javascript
微信小程序开发实现的IP地址查询功能示例
2019/03/28 Javascript
Vue 样式切换及三元判断样式关联操作
2020/08/09 Javascript
vue绑定数字类型 value为数字的实例
2020/08/31 Javascript
python将数组n等分的实例
2019/12/02 Python
Python3 中sorted() 函数的用法
2020/03/24 Python
Anaconda和ipython环境适配的实现
2020/04/22 Python
Keras load_model 导入错误的解决方式
2020/06/09 Python
selenium设置浏览器为headless无头模式(Chrome和Firefox)
2021/01/08 Python
Urban Decay官方网站:美国化妆品品牌
2020/06/04 全球购物
机电专业毕业生推荐信
2013/11/10 职场文书
业务员岗位职责范本
2013/12/15 职场文书
大课间活动制度
2014/01/18 职场文书
机关道德讲堂实施方案
2014/03/15 职场文书
中国梦口号
2014/06/13 职场文书
中学生社会实践活动总结
2014/07/03 职场文书
2014年秋季开学寄语
2014/08/02 职场文书
小学优秀教师事迹材料
2014/12/16 职场文书
食堂采购员岗位职责
2015/04/03 职场文书