JavaScript数据类型

变量用来临时存储数据(如果想要永久的存储数据,需要通过数据库)。而在任何一门编程语言当中,数据都是分为不同类型的。就如同人类也分为男人和女人一样。

下面就来说一下在JavaScript中数据的不同类型。

js当中数据类型分为两类,一类是原始类型,一类是引用数据类型原始类型又称之为基础数据类型引用类型也称之为对象类型

原始类型的数据包含有下面几个:

  • Boolean(bu li an)
  • Null(no)
  • Undefined(ang di fa yin te)
  • Number(nan bo)
  • String(si zhun)
  • Symbol(sen bou)(ES6中新增加的内容)

引用类型(复合类型)的数据包含有下面几个:

  • Object(ao bu jie ke te)
  • Array(er rui)
  • Function(fang ke shen)

js当中,引用类型也包括Date(dai te)Math(mai si)RegExp(正则表达式)等内容。

需要注意的是,JS当中的原始值并不能够更改,也就意味着一旦一个原始值创建成功。那么将不能够进行第二次的值得修改,除非重新创建一个数据。

原始类型和引用类型的区别:
二者在内存中存储的位置不同。原始数据类型存储在栈中,而引用数据类型实际存储在内存的堆中。而如果把某个引用数据类型的数据存储到了一个变量当中,本质上是把数据在堆中的位置存储在了变量中,变量存储在内存的栈中。

Boolean

In computer science, a Boolean is a logical data type that can have only the values true or false. For example, in JavaScript, Boolean conditionals are often used to decide which sections of code to execute (such as in if statements) or repeat (such as in for loops).

MDN中,对于JavaScript中的布尔值(Boolean)有上面一段描述,翻译过来的意思大致如下:

在计算机科学中,布尔值是一种逻辑数据类型,其值只能为真或假。例如,在JavaScript中,布尔条件
常用于决定执行哪一部分代码(例如在if语句中)或重复(例如在For循环中)。

布尔值包含有两个值truefalse。其中true表示false表示

例如我们判断一个条件,如果这个条件满足,那么对应着布尔值true,如果这个条件不满足,那么就对应着布尔值false

下列运算符会返回布尔值:

  • 前置逻辑运算符: ! (Not)
  • 相等运算符:===!====!=
  • 比较运算符:>>=<<=

如果 JavaScript 预期某个位置应该是布尔值,会将该位置上现有的值自动转为布尔值。转换规则是除了下面六个值被转为false,其他值都视为true

  • undefined
  • null
  • false
  • 0
  • NaN
  • ""''(空字符串)

Null

In computer science, a null value represents a reference that points, generally intentionally, to a nonexistent or invalid object or address. The meaning of a null reference varies among language implementations.

In JavaScript, null is one of the primitive values.

译文:

在计算机科学中,空值表示一个引用,该引用通常有意指向不存在或无效的对象或地址。空引用的含义因语言实现而异。

在JavaScript中,null是一个基本值(原始数据)。

Null类型里面只有一个值,就是null
关于null,你可以把它理解为,它表示一个空值。
null这个值专门用来表示一个为空的对象,
使用typeof运算符检查一个null值时,会返回object

var a = null; 

例如上面的代码当中,你可以理解为此事的变量a表示的值为空。

当我们在一些需要传递值的地方,如果我们没有值进行传递,那么就可以传递一个null,表示传递的值为空。

undefined

Undefined类型当中只有一个值就是undefined

在代码的编写过程中,一个没有被赋值的变量的类型就是undefined(未定义)。

var a;
console.log(a); // 会在浏览器的控制台中输出undefined

如果一个变量声明但是没有被赋值,我们就可以使用typeof运算符来检查一下结果.

var a;
console.log(typeof a);// 输出undefined类型

Number

Number类型即为数字类型,包括整数和浮点数(小数)。

MDN中关于Number类型的描述如下:

根据 ECMAScript 标准,JavaScript 中只有一种数字类型:基于 IEEE 754 标准的双精度 64 位二进制格式的值(-(263 -1) 到 263 -1)。它并没有为整数给出一种特定的类型。除了能够表示浮点数外,还有一些带符号的值:+Infinity-InfinityNaN (非数值,Not-a-Number)。

JavaScript 内部,所有数字都是以64位浮点数形式储存,即使整数也是如此。所以,11.0是相同的,是同一个数。

1 === 1.0 // true

这就是说,JavaScript 语言的底层根本没有整数,所有数字都是小数(64位浮点数)。容易造成混淆的是,某些运算只有整数才能完成,此时 JavaScript 会自动把64位浮点数,转成32位整数,然后再进行运算。

由于浮点数不是精确的值,所以涉及小数的比较和运算要特别小心。

0.1 + 0.2 === 0.3
// false

0.3 / 0.1
// 2.9999999999999996

(0.3 - 0.2) === (0.2 - 0.1)
// false

数值范围:

根据标准,64位浮点数的指数部分的长度是11个二进制位,意味着指数部分的最大值是2047(2的11次方减1)。也就是说,64位浮点数的指数部分的值最大为2047,分出一半表示负数,则 JavaScript 能够表示的数值范围为21024到2-1023(开区间),超出这个范围的数无法表示。JS中可以表示的数字的最大值Number.MAX_VALUE,
Number.MIN_VALUE则表示0以上的最小值

如果一个数大于等于2的1024次方,那么就会发生“正向溢出”,即 JavaScript 无法表示这么大的数,这时就会返回Infinity

如果一个数小于等于2的-1075次方(指数部分最小值-1023,再加上小数部分的52位),那么就会发生为“负向溢出”,即 JavaScript 无法表示这么小的数,这时会直接返回0。

Math.pow(2, -1075) // 0

下面是一个实际的例子。

var x = 0.5;

for(var i = 0; i < 25; i++) {
  x = x * x;
}

x // 0

上面代码中,对0.5连续做25次平方,由于最后结果太接近0,超出了可表示的范围,JavaScript 就直接将其转为0。

而如果在js小于-1.7976931348623157E+103088 的时候,就会表示为-Infinity.

Number当中的特殊值:

1、正零和负零

JavaScript 的64位浮点数之中,有一个二进制位是符号位。这意味着,任何一个数都有一个对应的负值,就连0也不例外。

JavaScript 内部实际上存在2个0:一个是+0,一个是-0,区别就是64位浮点数表示法的符号位不同。它们是等价的。

-0 === +0 // true
0 === -0 // true
0 === +0 // true

几乎所有场合,正零和负零都会被当作正常的0

+0 // 0
-0 // 0
(-0).toString() // '0'
(+0).toString() // '0'

但是当0-0被充当分母的时候,返回的值是不相等的。

(1 / +0) === (1 / -0) // false

上面的代码之所以出现这样结果,是因为除以正零得到+Infinity,除以负零得到-Infinity,这两者是不相等的。

2、NaN

NaN是 JavaScript 的特殊值,表示“非数字”(Not a Number),主要出现在将字符串解析成数字出错的场合。

console.log(5 - 'x'); //NaN

需要注意的是,NaN不是独立的数据类型,而是一个特殊数值,它的数据类型依然属于Number,使用typeof运算符可以看得很清楚。

需要注意,NaN是一个非常狠的角色,它连自己都不认,也就是说,如果你判断NaN是否等于NaN,答案是否定的,也就是false,二者根本不相等。

3、Infinity

Infinity表示为无穷大。在js中,如果数值的内容超过了js所能表示的范围,就会输出Infinity或者-Infinity

Number当中的全局方法:

1、parseInt()

parseInt方法用于将字符串转为整数。

parseInt('123') // 123

如果字符串头部有空格,空格会被自动去除。

parseInt('   81') // 81

如果parseInt的参数不是字符串,则会先转为字符串再转换。

parseInt(1.23) // 1
// 等同于
parseInt('1.23') // 1

字符串转为整数的时候,是一个个字符依次转换,如果遇到不能转为数字的字符,就不再进行下去,返回已经转好的部分。

parseInt('8a') // 8
parseInt('12**') // 12
parseInt('12.34') // 12
parseInt('15e2') // 15
parseInt('15px') // 15

上面代码中,parseInt的参数都是字符串,结果只返回字符串头部可以转为数字的部分。

如果字符串的第一个字符不能转化为数字(后面跟着数字的正负号除外),返回NaN

parseInt('abc') // NaN
parseInt('.3') // NaN
parseInt('') // NaN
parseInt('+') // NaN
parseInt('+1') // 1

所以,parseInt的返回值只有两种可能,要么是一个十进制整数,要么是NaN

2、parseFloat()

parseFloat方法用于将一个字符串转为浮点数。

parseFloat('3.14') // 3.14

如果字符串符合科学计数法,则会进行相应的转换。

parseFloat('314e-2') // 3.14
parseFloat('0.0314E+2') // 3.14

如果字符串包含不能转为浮点数的字符,则不再进行往后转换,返回已经转好的部分。

parseFloat('3.14more non-digit characters') // 3.14

parseFloat方法会自动过滤字符串前导的空格。

parseFloat('\t\v\r12.34\n ') // 12.34

如果参数不是字符串,或者字符串的第一个字符不能转化为浮点数,则返回NaN

parseFloat([]) // NaN
parseFloat('FF2') // NaN
parseFloat('') // NaN
parseFloat('1avc') // 1
parseFloat('a1') // NaN

上面代码中,尤其值得注意,parseFloat会将空字符串转为NaN

这些特点使得parseFloat的转换结果不同于Number函数。

parseFloat(true)  // NaN
Number(true) // 1

parseFloat(null) // NaN
Number(null) // 0

parseFloat('') // NaN
Number('') // 0

parseFloat('123.45#') // 123.45
Number('123.45#') // NaN

3、isNaN()

isNaN方法可以用来判断一个值是否为NaN

isNaN(NaN) // true
isNaN(123) // false

但是,isNaN只对数值有效,如果传入其他值,会被先转成数值。比如,传入字符串的时候,字符串会被先转成NaN,所以最后返回true,这一点要特别引起注意。也就是说,isNaNtrue的值,有可能不是NaN,而是一个字符串。

isNaN('Hello') // true
// 相当于
isNaN(Number('Hello')) // true

4、isFinite()

isFinite方法返回一个布尔值,表示某个值是否为正常的数值。

isFinite(Infinity) // false
isFinite(-Infinity) // false
isFinite(NaN) // false
isFinite(undefined) // false
isFinite(null) // true
isFinite(-1) // true

除了Infinity-InfinityNaNundefined这几个值会返回falseisFinite对于其他的数值都会返回true

String

0个或者任意多个字符排列起来放在单引号或者双引号当中,就是一个字符串(String)

var a = "hello,world!";
var b = 'hello,JavaScript!';

上面的变量ab当中存储的数据就是字符串,其中一个使用了单引号,一个使用了双引号,两者都是合法的。

单引号字符串的内部,可以使用双引号。双引号字符串的内部,可以使用单引号。

'key = "value"'
"It's a long journey"

如果要在单引号字符串的内部,使用单引号,就必须在内部的单引号前面加上反斜杠,用来转义。双引号字符串内部使用双引号,也是如此。

'Did she say \'Hello\'?'
// "Did she say 'Hello'?"

"Did she say \"Hello\"?"
// "Did she say "Hello"?"

由于 HTML 语言的属性值使用双引号,所以很多项目约定JavaScript语言的字符串只使用单引号,在这套系列教程中会遵守这个约定。当然,只使用双引号也完全可以。重要的是坚持使用一种风格,不要一会使用单引号表示字符串,一会又使用双引号表示。

字符串默认只能写在一行内,分成多行将会报错。

'a
b
c'
// SyntaxError: Unexpected token ILLEGAL

上面代码将一个字符串分成三行,JavaScript 就会报错。

如果长字符串必须分成多行,可以在每一行的尾部使用反斜杠。

var longString = 'Long \
long \
long \
string';

longString
// "Long long long string"

上面代码表示,加了反斜杠以后,原来写在一行的字符串,可以分成多行书写。但是,输出的时候还是单行,效果与写在同一行完全一样。注意,反斜杠的后面必须是换行符,而不能有其他字符(比如空格),否则会报错。

连接运算符(+)可以连接多个单行字符串,将长字符串拆成多行书写,输出的时候也是单行。

var longString = 'Long '
  + 'long '
  + 'long '
  + 'string';

Object(对象)

对象是一系列命名变量,函数的集合,其中变量的类型可以是基本类型也可以是复合类型,对象中的命名变量称为属性,而对象中的函数称为方法。对象访问属性和函数的方法是通过". "来实现的。
JavaScript是基于对象的脚本语言,它提供了大量的内置对象供用户使用,比如有以下内置类:

Array:数组类
Date:日期类
Error:错误类
Function:函数类
Math;数学类,该对象包含相当多的执行数学运算的方法
Number:数值类
Object:对象类
String:字符串类

<script type="text/javascript">
    var person=new Object();
    person.firstname="John";
    person.lastname="Doe";
    person.age=50;
    person.eyecolor="blue"; 
    document.write(person.firstname + " is " + person.age + " years old.");
</script>

宿主对象
由JS的运行环境提供的对象,目前来讲主要指浏览器提供的对象,比如BOMDOM

自定义对象
由开发人员自己创建的对象。

Array(数组)

数组是一系列的变量,数组中的变量的类型可以不相同。定义一个数字有以下三种语法:
Var a = [1,2,3,]
Var b = [ ];
Var c = new Array();
第一种在定义数组时已经对数组进行初始化,第二种和第三种都只是创建了一个空数组。

<script type="text/javascript">
    var a = [3,5,23];
    var b = [];
    var c = new Array();
    b[0] = 'hello';
    b[1] = 6;
    c[5] = true;
    c[7] = null;
    document.write(a + "\n" + b + "\n" + c +"<br/>");
    document.write("a数组的长度为:" +a.length +"<br/>");
    document.write("b数组的长度为:" +b.length +"<br/>");
    document.write("c数组的长度为:" +c.length +"<br/>");
            
</script> 

JavaScript作为动态的,弱类型语言,有以下3个特征:

  • JavaScript的数组长度可变。数组长度总等于所有元素索引最大值+1
  • 同一个数组中的元素类型可以互不相同
    访问数组元素时不会产生数组越界,访问并未赋值的数组元素时,该元素的值为undefined。
  • JavaScript中的数组本身就是一个功能十分强大的“容器”,它不仅仅可以代表数组,而且可以作为长度可变的线性表使用,还可以作为栈使用,也可以作为队使用。

JavaScript中数组作为栈使用的两个方法如下:

  • push(ele):元素入栈,返回入栈后的数组的长度。
  • pop():元素出栈,返回出栈的数组元素。

JavaScript中数组作为队列使用的两个方法:

  • unshift():元素入队列,返回入队列后数组的长度。
  • shift():元素出队列,返回出队列的数组元素。
<script type="text/javascript">
    var stack = [];
    stack.push("百度");
    stack.push("阿里巴巴");
    console.log(stack.pop());
    console.log(stack.pop());

    var queue = [];
    queue.unshift("淘宝");
    queue.unshift("京东");
    console.log(queue.shift());
    console.log(queue.shift());
</script>

此外,Array对象还定义了如下的方法:

  • concat(value,....):为元素添加一个或多个元素,该方法返回追加元素后得到的数组,但原数组并不改变。
  • join():将数组的多个元素拼接在一块,组成字符串返回。
  • reverse():反转数组包含的元素。
  • slice(start,end):截取数组在开始索引和结束索引之间的子数组,该方法返回截取得到的数组,但是原数组并不改变。
  • sort():将数组元素进行排序。
  • Splice(start,delcount,value):截取一个字符串,从开始索引开始,删除delcount个元素,再将新的value值追加到数字中,该方法返回数组被截取部分组成的新数组。

function(函数)

JavaScript中的函数类型有返回值,但是无返回类型。函数中可以包含一段可执行的代码,也可以接受调用者传入参数。JavaScript的函数声明中,参数列表不需要数据类型声明,函数的返回值也不需要声明数据类型。

 function judgeAge( age ){      
    if(typeof age === "number"){
        if(age > 60){           
            alert('老年人');
        }else if(age > 40){
            alert('中年人');
        }else if(age > 15){
            alert('青年人');
        }else{
        alert('儿童');
        }
        }else{
        alert('参数必须为数值');
       }
}
    judgeAge(55);

转义字符:

反斜杠()在字符串内有特殊含义,用来表示一些特殊字符,所以又称为转义符。

需要用反斜杠转义的特殊字符,主要有下面这些。

  • \0 :null(\u0000
  • \b :后退键(\u0008
  • \f :换页符(\u000C
  • \n :换行符(\u000A
  • \r :回车键(\u000D
  • \t :制表符(\u0009
  • \v :垂直制表符(\u000B
  • \' :单引号(\u0027
  • \" :双引号(\u0022
  • \\ :反斜杠(\u005C

如果在一个正常的字符前面加了\,是没有效果的。

console.log("\a"); //输出a
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 203,772评论 6 477
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,458评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,610评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,640评论 1 276
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,657评论 5 365
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,590评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,962评论 3 395
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,631评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,870评论 1 297
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,611评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,704评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,386评论 4 319
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,969评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,944评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,179评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 44,742评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,440评论 2 342

推荐阅读更多精彩内容