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 相关文章推荐
使用Modello编写JavaScript类
Dec 22 Javascript
一页面多XMLHttpRequest对象
Jan 22 Javascript
js控制文本框只输入数字和小数点的方法
Mar 10 Javascript
jquery实现未经美化的简洁TAB菜单效果
Aug 28 Javascript
jQuery 限制输入字符串长度
Jun 20 Javascript
原生js实现键盘控制div移动且解决停顿问题
Dec 05 Javascript
浅谈Angular4中常用管道
Sep 27 Javascript
详解基于Vue2.0实现的移动端弹窗(Alert, Confirm, Toast)组件
Aug 02 Javascript
Layui给数据表格动态添加一行并跳转到添加行所在页的方法
Aug 20 Javascript
简述vue-cli中chainWebpack的使用方法
Jul 30 Javascript
使用Node.js实现base64和png文件相互转换的方法
Mar 11 Javascript
vue+axios全局添加请求头和参数操作
Jul 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 修改zen-cart下单和付款流程以防止漏单
2010/03/08 PHP
PHP 函数学习简单小结
2010/07/08 PHP
PHP常用函数之根据生日计算年龄功能示例
2019/10/21 PHP
学习ExtJS form布局
2009/10/08 Javascript
js 延迟加载 改变JS的位置加快网页加载速度
2012/12/11 Javascript
在百度知道团队中快速审批新成员的js脚本
2014/02/02 Javascript
JavaScript基础语法、dom操作树及document对象
2014/12/02 Javascript
详解Javascript继承的实现
2016/03/25 Javascript
很棒的js Tab选项卡切换效果
2016/08/30 Javascript
Angularjs CURD 详解及实例代码
2016/09/14 Javascript
JS实现的验证身份证及获取地区功能示例
2017/01/16 Javascript
使用原生的javascript来实现轮播图
2017/02/24 Javascript
node.js(express)中使用Jcrop进行图片剪切上传功能
2017/04/21 Javascript
详解小程序原生使用ES7 async/await语法
2018/08/06 Javascript
对node通过fs模块判断文件是否是文件夹的实例讲解
2019/06/10 Javascript
vue使用map代替Aarry数组循环遍历的方法
2020/04/30 Javascript
JavaScript监听键盘事件代码实现
2020/06/03 Javascript
详解ES6 中的Object.assign()的用法实例代码
2021/01/11 Javascript
[16:21]教你分分钟做大人:圣堂刺客
2014/12/03 DOTA
Python yield使用方法示例
2013/12/04 Python
Python中实现三目运算的方法
2015/06/21 Python
Python 常用string函数详解
2016/05/30 Python
深入浅出分析Python装饰器用法
2017/07/28 Python
django实现登录时候输入密码错误5次锁定用户十分钟
2017/11/05 Python
matplotlib 纵坐标轴显示数据值的实例
2018/05/25 Python
python3基于OpenCV实现证件照背景替换
2018/07/18 Python
django+mysql的使用示例
2018/11/23 Python
VS2019+python3.7+opencv4.1+tensorflow1.13配置详解
2020/04/16 Python
opencv+python实现鼠标点击图像,输出该点的RGB和HSV值
2020/06/02 Python
python 基于opencv实现高斯平滑
2020/12/18 Python
用CSS3写的模仿iPhone中的返回按钮
2015/04/04 HTML / CSS
美国购买汽车零件网站:Buy Auto Parts
2018/04/02 全球购物
环保建议书作文500字
2015/09/14 职场文书
那些美到让人窒息的诗句,值得你收藏!
2019/08/20 职场文书
MySQL8.0的WITH查询详情
2021/08/30 MySQL
详解Oracle数据库中自带的所有表结构(sql代码)
2021/11/20 Oracle