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 相关文章推荐
自己动手开发jQuery插件教程
Aug 25 Javascript
input 和 textarea 输入框最大文字限制的jquery插件
Oct 27 Javascript
深入Javascript函数、递归与闭包(执行环境、变量对象与作用域链)使用详解
May 08 Javascript
javascript验证只能输入数字和一个小数点示例
Oct 21 Javascript
使用js检测浏览器是否支持html5中的video标签的方法
Mar 12 Javascript
jquery果冻抖动效果实现方法
Jan 15 Javascript
深入浅出理解javaScript原型链
May 09 Javascript
AngularJS实现按钮提示与点击变色效果
Sep 07 Javascript
基于BootStrap multiselect.js实现的下拉框联动效果
Jul 28 Javascript
js中apply与call简单用法详解
Nov 06 Javascript
详解如何制作并发布一个vue的组件的npm包
Nov 10 Javascript
vue.js实现会动的简历(包含底部导航功能,编辑功能)
Apr 08 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与SQL注入攻击[二]
2007/04/17 PHP
php面向对象全攻略 (九)访问类型
2009/09/30 PHP
php利用header函数下载各种文件
2016/08/24 PHP
简单的邮箱登陆的提示效果类似于yahoo邮箱
2014/02/26 Javascript
JQuery打造省市下拉框联动效果
2014/05/18 Javascript
js实现简单排列组合的方法
2016/01/27 Javascript
分分钟玩转Vue.js组件
2016/10/25 Javascript
jquery滚动条插件slimScroll使用方法
2017/02/09 Javascript
JavaScript之Date_动力节点Java学院整理
2017/06/28 Javascript
web页面和微信小程序页面实现瀑布流效果
2018/09/26 Javascript
vue自定义js图片碎片轮播图切换效果的实现代码
2019/04/28 Javascript
微信小程序 云开发模糊查询实现解析
2019/09/02 Javascript
jquery实现商品sku多属性选择功能(商品详情页)
2019/12/20 jQuery
angular中的post请求处理示例详解
2020/06/30 Javascript
vue 中的动态传参和query传参操作
2020/11/09 Javascript
python基础教程之基本数据类型和变量声明介绍
2014/08/29 Python
python插入排序算法实例分析
2015/07/03 Python
教你用Python脚本快速为iOS10生成图标和截屏
2016/09/22 Python
python thrift搭建服务端和客户端测试程序
2018/01/17 Python
python write无法写入文件的解决方法
2019/01/23 Python
Python 保持登录状态进行接口测试的方法示例
2019/08/06 Python
Django实现后台上传并显示图片功能
2020/05/29 Python
MATLAB数学建模之画图汇总
2020/07/16 Python
Python制作简单的剪刀石头布游戏
2020/12/10 Python
Skyscanner加拿大:全球旅行搜索平台
2018/11/19 全球购物
汽车专业毕业生自荐信
2013/11/03 职场文书
招商经理岗位职责
2013/11/16 职场文书
工厂门卫岗位职责
2013/11/25 职场文书
数字化校园建设方案
2014/05/03 职场文书
励志演讲稿800字
2014/08/21 职场文书
英语读书笔记
2015/07/02 职场文书
2015中学教学工作总结
2015/07/22 职场文书
公司员工管理制度
2015/08/04 职场文书
Spring整合Mybatis的全过程
2021/06/28 Java/Android
sql查询语句之平均分、最高最低分及排序语句
2022/05/30 MySQL
Python使用Opencv打开笔记本电脑摄像头报错解问题及解决
2022/06/21 Python