• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号
您的位置:首页 > 程序设计 >JavaScript > JavaScript 数据类型详解

JavaScript 数据类型详解

作者:水墨墨心 字体:[增加 减小] 来源:互联网 时间:2017-05-11

水墨墨心通过本文主要向大家介绍了javascript详解,javascript详解pdf,javascript数据类型,javascript中数据类型,javascript 类型转换等相关知识,希望对您有所帮助,也希望大家支持linkedu.com www.linkedu.com

一,数据类型

以下内容基于ES5(ES6引入了一种新的原始数据类型Symbol,表示独一无二的值。它是JavaScript语言的第七种数据类型。)

JavaScript是一种弱类型动态语言,定义变量时无需指定类型,看似简单,但背后有繁琐的转换逻辑。让我们一起来看下js常见的数据类型和背后的隐式转换逻辑。

ES5中有5种简单的数据类型(也叫基本数据类型):number,string,boolean,null,undefined(null和undefined是两种特殊的基本数据类型,下面会讲到);还有一种复杂数据类型——Object(函数是一种特殊的对象,后面会讲到)

Undefined类型:

Undefined类型只有一个值,即特殊的undefined。在使用var声明变量但未对其加以初始化时,这个变量的值就是undefined,例如:

var message;
alert(message == undefined);//true
</div>

这个例子只声明了变量message,但未对其进行初始化。比较这个变量与undefined字面量,结果表明它们是相等的。这个例子与下面的例子是等价的:

var message = undefined;
alert(message == undefined);//true 
</div>

这个例子是用undefined值显示初始化了变量message.但我们没有必要这么做,因为未经初始化的值默认都会取得undefined值。

(一般而言,不存在需要显示地把一个变量设置为undefined值的情况。字面值undefined的主要目的是用于比较,而ECMA-262第3版之前的版本中并没有规定这个值。第3版引入这个值是为了正式区分空对象指针与未经初始化的变量。)

不过,包含undefined值的变量与尚未定义的变量还是不一样的。请看下面的例子:

var message;//这个变量声明之后默认取得了undefined值
//下面这个变量并没有声明
//var age
alert(message);//'undefined'
alert(age);//产生错误 Uncaught ReferenceError: age is not defined(…)
</div>

运行以上代码,第一个警告框会显示变量message的值,即'undefined'。而第二个警告框由于传递给alert()函数的是尚未声明的变量age,则会导致一个错误。对于尚未声明过的变量,只能执行一项操作,即使用typeof操作符检测其数据类型。

然而,令人困惑的是:对未初始化的变量执行typeof操作符会返回undefined值,而对未声明的变量执行typeof操作符同样也会返回undefined值。来看下面的例子:

var message;//这个变量声明之后默认取得了undefined值
//下面这个变量并没有声明
//var age
alert(typeof message);//'undefined'
alert(typeof age);//'undefined'
</div>

结果表明,对未初始化和未声明的变量执行typeof操作符都返回了undefined值,这个结果有其逻辑上的合理性,因为虽然这两种变量从技术角度看有本质区别,但实际上无论对哪种变量也不可能执行真正的操作。

(即使未初始化的变量会自动被赋予undefined值,但我们仍然建议读者养成显式初始化变量-即在声明变量的同时给变量赋值的习惯。如果能够做到这一点,那么当typeof操作符返回undefined值时,我们就知道被检测的变量是还没有被声明的,而不是尚未初始化的了。)

Null类型

Null类型是第二个只有一个值的数据类型,这个特殊的值就是null。从逻辑角度来看,null值表示一个空对象指针,而这也正是typeof操作符检测null值会返回'Object'的原因,如下面的例子所示:

var car = null;
alert(typeof car);//'object'
</div>

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

if(car != null){
 //对car执行某些操作
}
</div>

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

alert(null == undefined);//'true'

这里,位于null和undefined之间的相等操作符(==)总是返回true,不过要注意的是,这个操作符出于比较的目的会转换其操作数(后面会详细介绍相关内容)。

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

二,隐式转换

+和-

在js中,虽然我们不需要显式地定义变量的类型,但在实际的处理中,会根据不同的类型,会有不同的处理。先看几个例子:

var x = 'The answer is ' + 42;//"The answer is 42" 这里的'+'会理解为字符串拼接
var y = 42 + ' is the answer';//"42 is the answer" 这里的'+'会理解为字符串拼接
'37' + 7;//"377" 这里的'+'会理解为字符串拼接
'37' - 7;//30 这里的'-'会理解为减法运算
</div>

我们也可以巧用类型转换,去做一些事情,比如想把一个变量num转换为数字类型,非常简单的办法就是减去数字‘0',如果想把一个变量num变为字符串类型,那么可以加上一个空字符串''。

var num;
num = num - 0;
alert(typeof num);//"number"
num = num + '';
alert(typeof num);//"string"
</div>

===

严格等于a===b,首先会判断等号两边的类型,如果两边的类型不同,直接返回false,不再往下进行,如果类型相同,判断值是否想等。需注意NaN和任何东西比较都不想等,包括和自己比较也不想等。另外,JavaScript中的对象的比较是用引用去比较,而不是用值去比较,所以比较两个对象也不相等,因为不是两个完全相同的对象。可以定义变量x(不区分类型),让x和x比较,返回true。

'1.23' === '1.23';//true
null === null;//true
undefined == undefined;//true
null === undefined;//false
NaN === NaN;//false NaN属于number值,和任何东西比较都不想等,包括和自己比较也不想等
NaN == NaN;//false NaN属于number值,和任何东西比较都不想等,包括和自己比较也不想等
[1,2] == [1,2];//false 由于js中对象的比较是用引用去比较,虽然两边都是数组,而且长度一样、相同的值、相同的顺序,也是不等的,因为不是完全相同的对象。
new Object() == new Object();//false 引用比较,两个空对象是不同的两个对象,不相等。
var x;
x === x;//true 定义变量x,,让x和x比较 返回true
</div>

==

如果类型相同,比较方法同'===',如果类型不同,会尝试类型转换和比较:

null == undefined //相等
number == string //尝试把string转换成number再去比较
1.0 == '1.0';//true
boolean == ? //无论右边是什么,会先把boolean先转换成数字,true转换成1,false转换成0,然后再去和右边的比较 
true == 1; //true.
object == number | string //会尝试把对象转换为基本类型再去比较 其他的情况是false.
new String('hi') == 'hi';//true
new Boolean(false) == 0;//true
</div>

三,包装对象

number,string,boolean这三种基本类型都有对应的包装类型,先看一个例子:

从上面的例子可以看出,js中当把一个基本类型(比如string类型)尝试以对象的方式去使用的时候,比如访问它的length属性,或者增加一些属性的时候,js会很智能地把被操作的基本类型转换成对应的包装类型对象,(相当于new String()),这个临时包装对象的内容和基本类型的值是一样的,当完成访问或者属性设置的时候,这个临时包装对象会被销毁掉,所以再去访问已经设置的属性,是访问不到的。number和boolean基本类型转换成包装类型对象的原理都是一样的。

var a = 'string';//定义变量a,赋值基本类型'string'
alert(a.length);//"6" 创建对应的临时包装对象,访问临时包装对象的length属性,得到结果6
a.t = 3;//3,设置成功后,临时对象被销毁,所以下面alert值是undefined
alert(a.t);//"undefined" 
</div>
var b = 123;
b.toString();//"123" 调用对应临时包装对象Number()上的toStri



 
分享到:QQ空间新浪微博腾讯微博微信百度贴吧QQ好友复制网址打印

您可能想查找下面的文章:

  • javascript 中的继承实例详解
  • JavaScript函数表达式详解及实例
  • JavaScript中双向数据绑定详解
  • JavaScript错误处理和堆栈追踪详解
  • JavaScript数据结构之广义表的定义与表示方法详解
  • JavaScript队列的应用实例详解【经典数据结构】
  • javascript编程实现栈的方法详解【经典数据结构】
  • javascript防篡改对象实例详解
  • 基于javascript的异步编程实例详解
  • JavaScript中的遍历详解(多种遍历)

相关文章

  • 2017-05-11Vue开发中整合axios的文件整理
  • 2017-05-11nodeJs链接Mysql做增删改查的简单操作
  • 2017-05-11RequireJS 依赖关系的实例(推荐)
  • 2017-05-11微信小程序 tabs选项卡效果的实现
  • 2017-05-11jquery submit()不能提交表单的解决方法
  • 2017-05-11jquery 实现复选框的全选操作实例代码
  • 2017-05-11Nodejs高扩展性的模板引擎 functmpl简介
  • 2017-05-11JS字符串按逗号和回车分隔的方法
  • 2017-05-11详解Vue方法与事件
  • 2017-05-11JS多文件上传的实例代码

文章分类

  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号

最近更新的内容

    • AngularJS路由切换实现方法分析
    • Angular1.x自定义指令实例详解
    • nodejs入门教程五:连接数据库的方法分析
    • jQuery日程管理插件fullcalendar使用详解
    • js中小数向上取整数,向下取整数,四舍五入取整数的实现(必看篇)
    • 浅析JavaScript中var that=this
    • Ionic 2 实现列表滑动删除按钮的方法
    • div实现自适应高度的textarea实现angular双向绑定
    • JS实现二叉查找树的建立以及一些遍历方法实现
    • 基于jQuery插件jqzoom实现的图片放大镜效果示例

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有