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 相关文章推荐
JavaScript加密解密7种方法总结分析
Oct 07 Javascript
DWR Ext 加载数据
Mar 22 Javascript
JS数组的遍历方式for循环与for...in
Jul 31 Javascript
Javascript获取当前日期的农历日期代码
Oct 08 Javascript
angular.js + require.js构建模块化单页面应用的方法步骤
Jul 19 Javascript
微信小程序自定义组件
Aug 16 Javascript
解决vue 格式化银行卡(信用卡)每4位一个符号隔断的问题
Sep 14 Javascript
Vue CLI 3搭建vue+vuex最全分析(推荐)
Sep 27 Javascript
对angularJs中2种自定义服务的实例讲解
Sep 30 Javascript
Bootstrap Paginator+PageHelper实现分页效果
Dec 29 Javascript
vue路由切换时取消之前的所有请求操作
Sep 01 Javascript
如何利用React实现图片识别App
Feb 18 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基础学习笔记
2007/03/18 PHP
php带抄送和密件抄送的邮件发送方法
2015/03/20 PHP
Laravel利用gulp如何构建前端资源详解
2018/06/03 PHP
Laravel Validator 实现两个或多个字段联合索引唯一
2019/05/08 PHP
简单的JS多重继承示例
2008/03/13 Javascript
js数组操作学习总结
2013/11/04 Javascript
简体中文转换繁体中文(实现代码)
2013/12/25 Javascript
js动态往表格的td中添加图片并注册事件
2014/06/12 Javascript
js数组与字符串的相互转换方法
2014/07/09 Javascript
使用jquery 简单实现下拉菜单
2015/01/14 Javascript
jquery动态导航插件dynamicNav用法实例分析
2015/09/06 Javascript
jQuery将表单序列化成一个Object对象的实例
2016/11/29 Javascript
JS中页面与页面之间超链接跳转中文乱码问题的解决办法
2016/12/15 Javascript
input获取焦点时底部菜单被顶上来问题的解决办法
2017/01/24 Javascript
详解nodeJS中读写文件方法的区别
2017/03/06 NodeJs
深入理解es6块级作用域的使用
2019/03/28 Javascript
Vue项目页面跳转时浏览器窗口上方显示进度条功能
2020/03/26 Javascript
js实现3D旋转效果
2020/08/18 Javascript
原生js实现自定义消息提示框
2020/11/19 Javascript
详解Python发送邮件实例
2016/01/10 Python
使用Python来开发Markdown脚本扩展的实例分享
2016/03/04 Python
python版opencv摄像头人脸实时检测方法
2018/08/03 Python
python调用动态链接库的基本过程详解
2019/06/19 Python
css3实现蒙版弹幕功能
2019/06/18 HTML / CSS
怎样从/向数据文件读/写结构
2014/11/23 面试题
保安员岗位职责
2013/11/17 职场文书
房产销售经理职责
2013/12/20 职场文书
教学大赛获奖感言
2014/01/15 职场文书
小学生综合素质评语
2014/04/23 职场文书
美术兴趣小组活动总结
2014/07/07 职场文书
同学聚会通知短信
2015/04/20 职场文书
2015教师年度思想工作总结
2015/04/30 职场文书
2016年三八节红领巾广播稿
2015/12/17 职场文书
使用php的mail()函数实现发送邮件功能
2021/06/03 PHP
Python与C++中梯度方向直方图的实现
2022/03/17 Python
Android学习之BottomSheetDialog组件的使用
2022/06/21 Java/Android