JavaScript 学习笔记之数据类型


Posted in Javascript onJanuary 14, 2015

一、分类

基本数据类型:undefined、null、string、Boolean、number

复杂数据类型:object

object的属性以无序的名称和值对的形式 (name : value) 来定义

二、详解

1、undefined:undefined类型只有一个值:undefined,在使用var对变量进行声明但未初始化时,这个变量的值就是undefined.

包含undefined值的变量与尚未定义的变量是不一样的,以下这个例子可以说明:

    var demo1;//声明但未初始化

    alert(demo1);//undefined

    alert(demo2);//报错,demo2 is not defined

2、null:null类型只有一个值:null,从逻辑角度来看,null值表示一个空对象指针.

如果定义的变量准备在将来用于保存对象,那么最好将该变量初始化为null而不是其他值。这样一来,只要直接检测null值就可以知道相应的变量是否已经保存了一个对象的引用了,例如:

    if(car != null)

    {

        //对car对象执行某些操作

    }

实际上,undefined值是派生自null值的,因此ECMA-262规定对它们的相等性测试要返回true。

alert(undefined == null); //true

尽管null和undefined有这样的关系,但它们的用途完全不同。无论在什么情况下都没有必要把一个变量的值显式地设置为undefined,可是同样的规则对null却不适用。换句话说,只要意在保存对象的变量还没有真正保存对象,就应该明确地让该变量保存null值。这样做不仅可以体现null作为空对象指针的惯例,而且也有助于进一步区分null和undefined。

3、Boolean:Boolean类型有两个值:true和false,这两个值与数字值不是一回事,因此true不一定等于1,而false也不一定等于0。

需要注意的是:Boolean类型的字面值是区分大小写的,也就是说,True和False(以及其他形式的大小写混合)都不是Boolean值,只是标识符。

 虽然Boolean类型的字面值只有两个,但JavaScript中所有类型的值都有与这两个Boolean值等价的值。要将一个值转换为其对应的Boolean值,可以调用类型转换函数Boolean(),例如:

    var message = 'Hello World';

    var messageAsBoolean = Boolean(message);

在这个例子中,字符串message被转换成了一个Boolean值,该值被保存在messageAsBoolean变量中。可以对任何数据类型的值调用Boolean()函数,而且总会返回一个Boolean值。至于返回的这个值是true还是false,取决于要转换值的数据类型及其实际值。下表给出了各种数据类型及其对象的转换规则。

这些转换规则对理解流控制语句(如if语句)自动执行相应的Boolean转换非常重要,例如:

var message = 'Hello World';

    if(message)//相当于if(Boolean(message)==true)

    {

        alert("Value is true");//Value is true

}

由于存在这种自动执行的Boolean转换,因此确切地知道在流控制语句中使用的是什么变量至关重要。

4、number:整数和浮点

4.1 整数:在进行计算时,所有的八进制和十六进制数都会被换算成十进制

4.2 浮点:浮点数值的最高精度是17位,因此在算数计算时其精度远远不如整数,例如:0.1+0.2的结果不是0.3,而是0.30000000000000004.例如:

a=0.2;

b=0.1;

if(a+b==0.3){

alert("hello");

}

else{

alert("hi");

}

结果会弹出“hi”,因此不要测试某个特定的浮点数值。

4.3 NaN:非数值 Not a Number,这个数值用于表示一个本来要返回数值的操作数未返回数值的情况(这样就不会抛出错误了)。

NaN本身有两个非同寻常的特点。首先,任何涉及NaN的操作(例如NaN/10)都会返回NaN,这个特点在多步计算中有可能导致问题。其次,NaN与任何值都不相等,包括NaN本身。例如:

alert(NaN == NaN);    //false

JavaScript中有一个isNaN()函数,这个函数接受一个参数,该参数可以是任何类型,而函数会帮我们确定这个参数是否“不是数值”。isNaN()在接收一个值之后,会尝试将这个值转换为数值。某些不是数值的值会直接转换为数值,例如字符串”10“或Boolean值。而任何不能被转换为数值的值都会导致这个函数返回true。例如:

    alert(isNaN(NaN));    //true

    alert(isNaN(10));    //false(10是一个数值)

    alert(isNaN("10"));    //false(可能被转换为数值10)

    alert(isNaN("blue"));    //true(不能被转换为数值)

    alert(isNaN("bule123")); //ture(不能被转换为数值)

    alert(isNaN(true));    //false(可能被转换为数值1)

有3个函数可以把非数值转换为数值:Number()、parseInt()和parseFloat()。第一个函数,即转型函数Number()可以用于任何数据类型,而另外两个函数则专门用于把字符串转换成数值。这3个函数对于同样的输入会返回不同的结果。

Number()函数的转换规则如下:

● 如果是Boolean值,true和false将分别被替换为1和0

● 如果是数字值,只是简单的传入和返回

● 如果是null值,返回0

● 如果是undefined,返回NaN

● 如果是字符串,遵循下列规则:

 ○ 如果字符串中只包含数字,则将其转换为十进制数值,即”1“会变成1,”123“会变成123,而”011“会变成11(前导的0被忽略)

 ○ 如果字符串中包含有效的浮点格式,如”1.1“,则将其转换为对应的浮点数(同样,也会忽略前导0)

 ○ 如果字符串中包含有效的十六进制格式,例如”0xf“,则将其转换为相同大小的十进制整数值

 ○ 如果字符串是空的,则将其转换为0

 ○ 如果字符串中包含除了上述格式之外的字符,则将其转换为NaN

● 如果是对象,则调用对象的valueOf()方法,然后依照前面的规则转换返回的值。如果转换的结果是NaN,则调用对象的toString()方法,然后再依次按照前面的规则转换返回的字符串值。

    var num1 = Number("Hello World");    //NaN

    var num2 = Number("");                //0

    var num3 = Number("000011");        //11

    var num4 = Number(true);            //1

由于Number()函数在转换字符串时比较复杂而且不够合理,因此在处理整数的时候更常用的是parseInt()函数,而处理浮点数的时候常用parseFloat()函数,详见:http://www.cnblogs.com/yxField/p/4167954.html

5、String

String类型用于表示由零或多个16位Unicode字符组成的字符序列,即字符串。字符串可以由单引号(')或双引号(")表示。

    var str1 = "Hello";

    var str2 = 'Hello';

任何字符串的长度都可以通过访问其length属性取得

alert(str1.length);        //输出5

要把一个值转换为一个字符串有两种方式。第一种是使用几乎每个值都有的toString()方法。

    var age = 11;

    var ageAsString = age.toString();    //字符串"11"

    var found = true;

    var foundAsString = found.toString();    //字符串"true"

数值、布尔值、对象和字符串值都有toString()方法。但null和undefined值没有这个方法。

多数情况下,调用toString()方法不必传递参数。但是,在调用数值的toString()方法时,可以传递一个参数:输出数值的基数。

    var num = 10;

    alert(num.toString());      //"10"

    alert(num.toString(2));     //"1010"

    alert(num.toString(8));     //"12"

    alert(num.toString(10));    //"10"

    alert(num.toString(16));    //"a"

通过这个例子可以看出,通过指定基数,toString()方法会改变输出的值。而数值10根据基数的不同,可以在输出时被转换为不同的数值格式。

在不知道要转换的值是不是null或undefined的情况下,还可以使用转型函数String(),这个函数能够将任何类型的值转换为字符串。String()函数遵循下列转换规则:

● 如果值有toString()方法,则调用该方法(没有参数)并返回相应的结果

● 如果值是null,则返回"null"

● 如果值是undefined,则返回”undefined“

6、object

 对象其实就是一组数据和功能的集合。对象可以通过执行new操作符后跟要创建的对象类型的名称来创建。而创建Object类型的实例并为其添加属性和(或)方法,就可以创建自定义对象。

var o = new Object();

object类型所具有的任何属性和方法也同样存在于更具体的对象中,Object的每个实例都具有下列属性和方法:

● constructor(构造函数)——保存着用于创建当前对象的函数

● hasOwnProperty(propertyName)——用于检查给定的属性在当前对象实例中(而不是在实例的原型中)是否存在。其中,作为参数的属性名(propertyName)必须以字符串形式指定(例如:o.hasOwnProperty("name"))

● isPrototypeOf(object)——用于检查传入的对象是否是另一个对象的原型

● propertyIsEnumerable(propertyName)——用于检查给定的属性是否能够使用for-in语句来枚举

● toString()——返回对象的字符串表示

● valueOf()——返回对象的字符串、数值或布尔值表示。通常与toString()方法的返回值相同。

 三、小测试

 

typeof(NaN)

typeof(Infinity)

typeof(null)

typeof(undefined)

很多面试都会问到上面几个小问题哒~~

以上就是这6种javascript数据类型的介绍了,小伙伴们是否了解清楚了呢,希望看完本文后大家能有所提高。

Javascript 相关文章推荐
JS获取图片实际宽高及根据图片大小进行自适应
Aug 11 Javascript
解决jquery操作checkbox火狐下第二次无法勾选问题
Feb 10 Javascript
jquery提交form表单时禁止重复提交的方法
Feb 13 Javascript
JS遍历Json字符串中键值对先转成JSON对象再遍历
Aug 15 Javascript
ztree获取当前选中节点子节点id集合的方法
Feb 12 Javascript
js style.display=block显示布局错乱问题的解决方法
Sep 21 Javascript
Vue.js组件tree实现无限级树形菜单
Dec 02 Javascript
AngularJS 限定$scope的范围实例详解
Jun 23 Javascript
常用的9个JavaScript图表库详解
Dec 19 Javascript
JavaScript模块管理的简单实现方式详解
Jun 15 Javascript
使用Vue+Django+Ant Design做一个留言评论模块的示例代码
Jun 01 Javascript
如何在 Vue 表单中处理图片
Jan 26 Vue.js
ExpressJS入门实例
Jan 14 #Javascript
jquery加载图片时以淡入方式显示的方法
Jan 14 #Javascript
JavaScript 学习笔记之变量及其作用域
Jan 14 #Javascript
jquery简单图片切换显示效果实现方法
Jan 14 #Javascript
Node.js开发之访问Redis数据库教程
Jan 14 #Javascript
Backbone.js中的集合详解
Jan 14 #Javascript
jquery增加和删除元素的方法
Jan 14 #Javascript
You might like
php删除文件夹及其文件夹下所有文件的函数代码
2013/01/23 PHP
Windows下安装PHP单元测试环境PHPUnit图文教程
2014/10/24 PHP
CodeIgniter分页类pagination使用方法示例
2016/03/28 PHP
[原创]php常用字符串输出方法分析(echo,print,printf及sprintf)
2016/07/09 PHP
详解thinkphp实现excel数据的导入导出(附完整案例)
2016/12/29 PHP
PHP实现压缩图片尺寸并转为jpg格式的方法示例
2018/05/10 PHP
Thinkphp5.0框架使用模型Model的获取器、修改器、软删除数据操作示例
2019/10/11 PHP
JavaScript 创建运动框架的实现代码
2013/05/08 Javascript
js一般方法改写成面向对象方法的无限级折叠菜单示例代码
2013/07/04 Javascript
jQuery实现级联菜单效果(仿淘宝首页菜单动画)
2014/04/10 Javascript
JS中attr和prop属性的区别以及优先选择示例介绍
2014/06/30 Javascript
JavaScript将Web页面内容导出到Word及Excel的方法
2015/02/13 Javascript
JS实现超简单的鼠标拖动效果
2015/11/02 Javascript
ES6下React组件的写法示例代码
2017/05/04 Javascript
纯js实现动态时间显示
2020/09/07 Javascript
详解从零搭建 vue2 vue-router2 webpack3 工程
2017/11/22 Javascript
详解小程序云开发数据库
2019/05/20 Javascript
[51:39]DOTA2-DPC中国联赛 正赛 Magma vs LBZS BO3 第二场 2月7日
2021/03/11 DOTA
Python实现简单的文件传输与MySQL备份的脚本分享
2016/01/03 Python
Python作用域用法实例详解
2016/03/15 Python
Python Selenium 之关闭窗口close与quit的方法
2019/02/13 Python
把JSON数据格式转换为Python的类对象方法详解(两种方法)
2019/06/04 Python
使用 Python 处理3万多条数据只要几秒钟
2020/01/19 Python
Python sqlite3查询操作过程解析
2020/02/20 Python
CSS3 Columns分列式布局方法简介
2014/05/03 HTML / CSS
web字体加载方案优化小结
2019/11/29 HTML / CSS
阿迪达斯比利时官方商城:adidas比利时
2016/10/10 全球购物
美国便宜的横幅和标志印刷在线:Best of Signs
2019/05/29 全球购物
澳大利亚领先的时尚内衣零售商:Bras N Things
2020/07/28 全球购物
编辑找工作求职信范文
2013/12/16 职场文书
计算机学生的自我评价分享
2014/02/18 职场文书
公司的门卫岗位职责
2014/09/09 职场文书
学校群众路线专项整治方案
2014/10/31 职场文书
2015年秋学期教研工作总结
2015/10/14 职场文书
成人成长感言如何写?
2019/08/16 职场文书
MySQL 原理与优化之Update 优化
2022/08/14 MySQL