js之数据类型

47 篇文章 1 订阅

js中的数据类型主要分为以下几个:

1,基本类型:数字(Number),字符串(String),布尔(boolean),null,undefined。Symbol(es6)

2,引用类型:数组(Array),对象(Object),Set和Map(es6)

其中Symbol,Set和Map是es6中新增的数据类型在本文后面会讲到,本文主要是讲述es6之前的数据类型。

1,Underfined。

  Undefined类型只有一个值,即特殊的undefined。在使用var声明变量但未对其加以初始化时,也就是未定义。不过,一般建议尽量给变量初始化,但是在早期的js版本中是没有规定undefined这个值的,所以在有些框架中为了兼容旧版浏览器,会给window对象添加undefined值。

window['undefined'] = window['undefined'];  
//或者
window.undefined = window.undefined;  

2,Null

  Null类型是第二个只有一个值的数据类型,这个特殊的值是null。从逻辑角度来看,null值表示一个空对象指针,而这也正是使用typeof操作符检测null时会返回object的原因。

let car = null;
console.log(typeof car); // "object"

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

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

    实际上,undefined值是派生自null值的,因此ECMA-262规定对它们的相等性测试要返回true。在严格相等计算的时候为false

console.log(undefined == null); //true

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

3,Boolean

    该类型只有两个字面值:true和false。这两个值与数字值不是一回事,因此true不一定等于1,而false也不一定等于0。虽然Boolean类型的字面值只有两个,但JavaScript中所有类型的值都有与这两个Boolean值等价的值。要将一个值转换为其对应的Boolean值,可以调用类型转换函数Boolean()

let message = 'Hello World';
let messageAsBoolean = Boolean(message);

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

在进行常规的变量内容判断,转化成boolean值做运算的时候,尽量使用!!来判断,具体原因详见:https://blog.csdn.net/swimming_in_IT_/article/details/80771118

4,Number

    (1)用来表示整数和浮点数值。

   (2)NaN:not a number 但是它是数字类型的。isNaN:检测当前值是否不是有效数字,返回true代表不是有效数字,返回false是有效数字。

//=>语法:isNaN([value])
var num=12;
isNaN(num); //->检测num变量存储的值是否为非有效数字 false

isNaN('13') =>false
isNaN('珠峰') =>true
isNaN(true) =>false
isNaN(false) =>false
isNaN(null) =>false
isNaN(undefined) =>true
isNaN({age:9}) =>true
isNaN([12,23]) =>true
isNaN([12]) =>false
isNaN(/^$/) =>true
isNaN(function(){}) =>true

    (3)NAN的检测机制。首先验证当前要检测的值是否为数字类型的,如果不是,浏览器会默认的把值转换为数字类型。把非数字类型的值转换为数字 - 其它基本类型转换为数字:直接使用Number这个方法转换的。

  [字符串转数字]
    Number('13') ->13
    Number('13px') ->NaN 如果当前字符串中出现任意一个非有效数字字符,结果则为NaN
    Number('13.5') ->13.5 可以识别小数

  [布尔转数字]
    Number(true) ->1
    Number(false) ->0

  [其它]
    Number(null) ->0
    Number(undefined) ->NaN

  - 把引用数据类型值转换为数字:先把引用值调取toString转换为字符串,然后再把字符串调取Number转换为数字

   [对象]
     ({}).toString() ->'[object Object]' ->NaN

   [数组]
     [12,23].toString() ->'12,23' ->NaN
     [12].toString() ->'12' ->12

   [正则]
     /^$/.toString() ->'/^$/' ->NaN

  Number('') ->0
  [].toString() ->''
  => isNaN([]):false

注意:当前检测的值已经是数字类型,是有效数字返回false,不是返回true(数字类型中只有NaN不是有效数字,其余都是有效数字)

(4)paserInt/paserFloat:等同于Number,也是为了把其它类型的值转换为数字类型。和Number的区别在于字符串转换分析上Number:出现任意非有效数字字符,结果就是NaN。parseInt:把一个字符串中的整数部分解析出来,parseFloat是把一个字符串中小数(浮点数)部分解析出来。

parseInt('13.5px') =>13
parseFloat('13.5px') =>13.5

parseInt('width:13.5px') =>NaN 从字符串最左边字符开始查找有效数字字符,并且转换为数字,但是一但遇到一个非有效数字字符,查找结束

(5)NaN和NaN比较:NaN与任何值都不相等,包括NaN本身。但是这种类型比较从逻辑上来讲是不正确的,所以在es6中新出了一个同值相等的算法来解决这个问题。方法是(Object.is()),详见:https://blog.csdn.net/swimming_in_IT_/article/details/78870346

5,String

    https://blog.csdn.net/swimming_in_IT_/article/details/85266777

6,Array

https://blog.csdn.net/swimming_in_IT_/article/details/82871889

7,对象

8,es6中新增数据类型

symbolhttp://es6.ruanyifeng.com/#docs/symbol

Set:提供了新的数据结构 Set。它类似于数组,但是成员的值都是唯一的,没有重复的值。Set 本身是一个构造函数,用来生成 Set 数据结构。

(1)属性:

  • Set.prototype.constructor:构造函数,默认就是Set函数。
  • Set.prototype.size:返回Set实例的成员总数。

(2)操作方法:

  • add(value):添加某个值,返回 Set 结构本身。
  • delete(value):删除某个值,返回一个布尔值,表示删除是否成功。
  • has(value):返回一个布尔值,表示该值是否为Set的成员。
  • clear():清除所有成员,没有返回值。

(3)遍历方法:

  • keys():返回键名的遍历器
  • values():返回键值的遍历器
  • entries():返回键值对的遍历器
  • forEach():使用回调函数遍历每个成员
let set = new Set(['red', 'green', 'blue']);

for (let item of set.keys()) {
  console.log(item);
}
// red
// green
// blue

for (let item of set.values()) {
  console.log(item);
}
// red
// green
// blue

for (let item of set.entries()) {
  console.log(item);
}

for (let x of set) {
  console.log(x);
}

let set = new Set([1, 4, 9]);
set.forEach((value, key) => console.log(key + ' : ' + value))
// 1 : 1
// 4 : 4
// 9 : 9

Map:它类似于对象,也是键值对的集合,但是“键”的范围不限于字符串,各种类型的值(包括对象)都可以当作键。也就是说,Object 结构提供了“字符串—值”的对应,Map 结构提供了“值—值”的对应,是一种更完善的 Hash 结构实现。如果你需要“键值对”的数据结构,Map 比 Object 更合适。

const m = new Map();
const o = {p: 'Hello World'};

m.set(o, 'content')
m.get(o) // "content"

m.has(o) // true
m.delete(o) // true
m.has(o) // false

(1)属性和方法。

  • size属性:属性返回 Map 结构的成员总数。
  • set(key, value):set方法设置键名key对应的键值为value,然后返回整个 Map 结构。如果key已经有值,则键值会被更新,否则就新生成该键。
  • get(key):读取key对应的键值,如果找不到key,返回undefined
  • has(key):返回一个布尔值,表示某个键是否在当前 Map 对象之中。
  • delete(key):删除某个键,返回true。如果删除失败,返回false
  • clear():清除所有成员,没有返回值。

(2)遍历方法

  • keys():返回键名的遍历器。
  • values():返回键值的遍历器。
  • entries():返回所有成员的遍历器。
  • forEach():遍历 Map 的所有成员。

详见:http://es6.ruanyifeng.com/#docs/set-map

 

 

 

 

 

 

 

 

 

 

 

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值