浅谈javascript六种数据类型以及特殊注意点


Posted in Javascript onDecember 20, 2013

在js中常见的六种数据类型:String类型、Null类型、Number类型、Boolean类型、Object类型。

1、typeof的注意点

涉及到数据类型,不免会提到,操作符 typeof。要注意:

1、typeof是操作符,不是方法。虽然我们经常使用typeof()的方式获取对象的数据类型。

2、对 null 取typeof  是 object(这是因为null是 空的对象引用),对函数取 typeof 是 function

alert(typeof null);    //返回 object
function demo(){
      alert('demo');
    }
alert(typeof demo);     //返回  function

2、为各种数据类型的对象变量设置初始值

注意,如果Object类型的 对象变量开始不知道赋值什么,不要  var demo={};最好是 设置成null;

var d2=null;
d2={'key':"shit"};
var d3='';//字符串 默认
var d4=0;   //Number 类型 初始值设置为0
var d5=null; //对object 类型设置初始默认值

3、undefined 和null 的区别和注意点

1、如果用 “==” 进行比较,他们是相等的,因为比较的是值

2、区分他们有两种方法(他们的核心都是比较他们的 数据类型)

  1)使用typeof 将他们区分开 

  2)使用全等“===”  :比较的是 值和 数据类型,只有全都相同 才返回 true

alert(undefined == null);             //true
alert(typeof undefined == typeof null); //false
alert(undefined === null);             //true

4、Boolean的注意点

1、true 和 1 比较是相同,false 和 0 比较是相同(是 “==” 比较),因为内部会实现 数据类型的 转化,将true 转换成1,将false 转换成0. js 内部有很多数据类型的自动转换,这是大家一定要注意的。后面还会提到很多。  但是使用“===”  就不相等了,因为 他们的数据类型是不等的。

2、显示转换成Boolean,使用Boolean()方法显示转换,需要注意的是各种数据类型,什么时候转换成true 什么时候转换成 false

  1)String类型,只要不是  空字符串  都会 转换成 true

  2)Number类型,只要不是 0 ,即使是 负数,都会转换成 true

  3)Object类型,只要 不是 null 类型,都会转换成true

  4)Undefined类型,都会转换成 false

我就不做演示,大家可以自己动手试一下。

3、(***)if()  语句的 ()  内部就是调用了 Boolean函数

5、Number类型注意点

 1、float类型 不能做精准运算

alert(0.1+0.2);//返回 0.300000000000000004

2、 支持 科学计数法 运算

3、NaN(Not a Number)

 1)var d=0/0;  注意:在js 里 是不会报错的,而是返回 NaN

 2)可以通过Number.NaN 来获取

 3)NaN和 任何 对象做运算都会返回 NaN

 4)isNaN()判断是不是 NaN

alert(isNaN(NaN));//true
alert(isNaN(12));//false
alert(isNaN('123'));//false:因为 字符串类型 的数字 可以自动转换成  数字
alert(isNaN('lew'));//true
alert(isNaN(false));//(*)false:因为 bool  值 可以转换成数字,true变1,,false 变 0

5)isNaN()内部执行原理:同样适用于对象。实现原理:首相调用对象的valueOf()方法,如果能转换成数字就直接做判断;如果不能就再调用toString()方法,然后测试返回值。

   valueOf()内部调用了toObject()方法,两个方法的 内部执行的原理:如下图:

浅谈javascript六种数据类型以及特殊注意点

var box={
        //重写  box 对象的 toString()  方法
        toString:function(){
              return '123';
            }
    };
alert(isNaN(box));//false
alert(box);//123   alert()内部也是 先调用了 对象的 valueOf()  然后调用 toString()方法

 6)将其他数据类型转换成Number类型

   含有三个函数:Number():可以针对所有的数据类型进行转换;parseInt()和parseFloat() 只 针对 字符串进行转化。

alert(Number('123'));//123
alert(Number('0234'));//234
alert(Number(true));//1
alert(Number(null));//(**)0
//除了 上面的  其他的都是 返回 NaN
alert(Number(undefined))//NaN

Number()内部实现的原理:同isNaN() 也是先调用 valueOf()  然后调用 toString()。。所以可想而知,性能是比较差的。。所以所过只要要被转型的对象是字符串的话,就调用 parseInt()  或者 parseFloat()因为他们内部不需要对类型做判断。

parseInt() 和 parseFloat()  调用注意:从第一个 为数字的 字符开始 一直到 第一个部位数字的字符 的前一个数字  的这部分字符串 转换成数字

alert(parseInt('123leb'));//123
alert(parseInt('123leb345'));//123
alert(parseInt('len234'));//NaN

当parseInt()里面的参数是 float类型的 那么只 取得 数字的  整数部分

alert(parseInt(56.12));//56

 6、String类型

 1)(*重要*)在ECMAScript中 字符串有不变性:字符串创建之后就不会再改变。

 要改变一个已经被赋值的字符串变量,首先要先销毁 变量中 字符串,然后再用一个包含 新值的字符串  填充变量。

var d='hello';
d=d+' shit';//执行过程:先将 'hello'赋值一份,然后将 d 中的字符串清空,将字符串 'hello' 和 ' shit'进行拼接,然后赋值给 d 变量。(所以 字符串 的值 一旦 被 创建之后 就不会 改变)

 2)toString()方法 将其他数据类型转换成 String类型。但是如果对 null 或undefined  进行操作的话就会报错。

 3)但是String()方法同样能实现 toString()的效果,但是 可以对 null 和undefined进行操作。

 内部原理:先 调用 toString(),如果可以转换成字符串,就将结果直接返回。否,再进行判断是 null 还是 undefined,然后返回‘null' 或 ‘undefined'

总结:如果知道 变量不可能是 null  或 undefined,就使用 toString()性能比 String(),因为 String()内部还要做判断,所以有损性能。

Javascript 相关文章推荐
利用javascript实现禁用网页上所有文本框,下拉菜单,多行文本域
Dec 14 Javascript
JS 打印界面的CSS居中代码适用所有浏览器
Mar 19 Javascript
JQuery右键菜单插件ContextMenu使用指南
Dec 19 Javascript
javascript的switch用法注意事项分析
Feb 02 Javascript
浅谈jQuery中height与width
Jul 06 Javascript
javascript常见数据验证插件大全
Aug 03 Javascript
js实现简单的省市县三级联动效果实例
Feb 18 Javascript
jQuery中get方法用法分析
Dec 07 Javascript
Node.js搭建小程序后台服务
Jan 03 Javascript
基于vue.js无缝滚动效果
Jan 25 Javascript
Node.js爬虫如何获取天气和每日问候详解
Aug 26 Javascript
小程序分享链接onShareAppMessage的具体用法
May 22 Javascript
js生成随机数之random函数随机示例
Dec 20 #Javascript
jquery实现tr元素的上下移动示例代码
Dec 20 #Javascript
解决JQeury显示内容没有边距内容紧挨着浏览器边线
Dec 20 #Javascript
JS比较两个时间大小的简单示例代码
Dec 20 #Javascript
javascript获取URL参数与参数值的示例代码
Dec 20 #Javascript
javascript获取鼠标点击元素对象(示例代码)
Dec 20 #Javascript
js 操作select与option(示例讲解)
Dec 20 #Javascript
You might like
php cache类代码(php数据缓存类)
2010/04/15 PHP
PHP zip扩展Linux下安装过程分享
2014/05/05 PHP
PHP使用Alexa API获取网站的Alexa排名例子
2014/06/12 PHP
mac环境中使用brew安装php5.5.15
2014/08/18 PHP
学习php设计模式 php实现工厂模式(factory)
2015/12/07 PHP
ThinkPHP5.0多个文件上传后找不到临时文件的修改方法
2018/07/30 PHP
基于PHP+Jquery制作的可编辑的表格的代码
2011/04/10 Javascript
Jquery css函数用法(判断标签是否拥有某属性)
2011/05/28 Javascript
JavaScript字符串对象substr方法入门实例(用于截取字符串)
2014/10/16 Javascript
运用jQuery定时器的原理实现banner图片切换
2014/10/22 Javascript
JavaScript 不支持 indexof 该如何解决
2016/03/30 Javascript
jquery实现网站列表切换效果的2种方法
2016/08/12 Javascript
微信小程序 五星评分(包括半颗星评分)实例代码
2016/12/14 Javascript
详解RequireJS按需加载样式文件
2017/04/12 Javascript
Vue input控件通过value绑定动态属性及修饰符的方法
2017/05/03 Javascript
vue-resource请求实现http登录拦截或者路由拦截的方法
2018/07/11 Javascript
微信小程序实现滑动切换自定义页码的方法分析
2018/12/29 Javascript
微信小程序自定义toast组件的方法详解【含动画】
2019/05/11 Javascript
vue之延时刷新实例
2019/11/14 Javascript
小程序实现图片预览裁剪插件
2019/11/22 Javascript
Vue 的双向绑定原理与用法揭秘
2020/05/06 Javascript
Python 中 Virtualenv 和 pip 的简单用法详解
2017/08/18 Python
啥是佩奇?使用Python自动绘画小猪佩奇的代码实例
2019/02/20 Python
详解pyinstaller selenium python3 chrome打包问题
2019/10/18 Python
python基于event实现线程间通信控制
2020/01/13 Python
python中的socket实现ftp客户端和服务器收发文件及md5加密文件
2020/04/01 Python
Python使用sqlite3模块内置数据库
2020/05/07 Python
使用SimpleITK读取和保存NIfTI/DICOM文件实例
2020/07/01 Python
Python实现一个优先级队列的方法
2020/07/31 Python
PyCharm中关于安装第三方包的三个建议
2020/09/17 Python
Python制作一个仿QQ办公版的图形登录界面
2020/09/22 Python
PREMIUM-MALL法国:行李、箱包及配件在线
2019/05/30 全球购物
Happy Socks英国官网:购买五颜六色的袜子
2020/11/03 全球购物
外贸采购员岗位职责
2014/03/08 职场文书
python可视化大屏库big_screen示例详解
2021/11/23 Python
JavaScript中reduce()的用法
2022/05/11 Javascript