news 2026/1/12 13:53:13

JavaScript有哪些数据类型?如何判断一个变量的数据类型?

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
JavaScript有哪些数据类型?如何判断一个变量的数据类型?

文章目录

  • JavaScript有哪些数据类型?如何判断一个变量的数据类型?
  • 1.JavaScript 的原生值 (primitive values)
    • 1.1 字符串 String
    • 1.2 布尔值 Boolean
    • 1.3 Number
    • 1.4 BigInt
    • 1.5 Undefined
    • 1.6 Null
    • 1.7 Symbol
  • 2.JavaScript中的对象(objects)
  • 3. 如何辨别一个变量的数据类型?
    • 3.1 使用typeof判断变量的数据类型
    • 3.2 判断变量是对象还是数组?

JavaScript有哪些数据类型?如何判断一个变量的数据类型?

JavaScript 有其内建的数据类型。其中又分为原生值(primitive values)和对象(objects)。

1.JavaScript 的原生值 (primitive values)

截至目前,JavaScript 的资料型别中,有七个原生值。这七个原生值以外的,全都是属于对象。

原生值是不可变的(immutable),意思是我们不能改变那个值本身。比如当我们“修改”原始值时,实际上是让变量重新绑定到一个新的值,而不是在原值上进行修改。

letgreeting="Hi";greeting="Hello";// 此时虽然打印 greeting 是 Hello,但是 Hi 这个值本身是没变的,只是 greeting 指向了Hello 这个新值

JavaScript 的型别中的七个原生值包含:

  • String
  • Boolean
  • Null
  • Undefined
  • Number
  • BigInt
  • Symbol

1.1 字符串 String

String (字符串)

字串是最常见的原生值之一。如前面提到,在JavaScript 当中字串本身是不可变的。当我们用substring()来撷取字串,或用concat()来把两个字串合为一,这些都是会回传另一个字串,而非改变原本的字串。

1.2 布尔值 Boolean

Boolean (布尔值)

truefalse两个值的布林值,也是JavaScript 的原生值。

1.3 Number

JavaScript 与一些语言不同,没有分整数与浮点数,而是都用number这个原生值。不论整数或浮点数,都是number这个型别。在JavaScript 当中,+Infinity,-Infinity, 与 NaN 都是number这个型别,所以我们用typeof来检查的话,会得到number

console.log(typeofNaN);// number

number在JavaScript 是双精度浮点数,所以精确度是介于-(2^53 − 1)2^53 − 1之间。在这个范围之外,就会有精准度的问题,这时候要用另一个原生值BigInt

1.4 BigInt

上面提到在JavaScript 的整数与浮点数,都是用number这个型别,这其实只说了一半。因为JavaScript 的number精准度有其限制,虽然多数情况很够用(2^53 - 1会是9007199254740991,我们很少用到比这大的数)。但有些时候会需要更往下的精准度。这时就可以用BigInt数值的型别。

BigInt可以让我们任意选择其精准度,就可以避免一些number会遇到的问题。它跟number一样可以用+,*,-,**, 与%等运算子,不过要注意不可以拿BigIntnumber型别的值交互使用,这会出现TypeError

1.5 Undefined

undefined是一个类型,它本身也是一个值。

  • 假如某个变量未声明就是用,会出现索引错误ReferenceError

    console.log(a);ReferenceError:a is not defined
  • 用 let / const 声明了,但在声明前使用

    console.log(a);leta=1;ReferenceError:Cannot access'a'before initialization
  • 某个变量声明但是没有赋值

    letgreeting;console.log(greeting);// undefined

1.6 Null

null是很容易跟undefined搞混的原生值。undefined是因为某变数还没有赋值,所以对JavaScript 来说,它不知道该变数的值是什么,所以要读取该变数时,会是undefined。不过 则null是我们赋予某个变数null这一个值。

1.7 Symbol

最后一个JavaScript 原生值是Symbol,它是一个独特(unique) 值,多半会搭配物件一起使用,作为物件的键(key)。

constsym=Symbol("ExplainYYDS");constobj={[sym]:"Interview Preps for Software Engineers"};obj[sym];// Interview Preps for Software Engineers

2.JavaScript中的对象(objects)

除了上述的七个原生值以外的存在,在JavaScript 当中都是对象。

JavaScript 圈有一个梗,数组是对象,函数是对象,对象是对象。

3. 如何辨别一个变量的数据类型?

3.1 使用typeof判断变量的数据类型

要辨别一个变数的数据类型,最常见的方式是透过typeof这个方法。举例来说typeof判断字符串。

letgreeting="hi";console.log(typeofgreeting);// 'string'

typeof 的两个注意点

  • typeof 原生值,返回的是该原生值的类型标识字符串,但是 typeof null 结果不是 null,而是object,这个历史遗留的 bug,修复成本太高了
  • typeof 数组的结果是 object ,tpyeof 函数的结果是 function
console.log(typeofnull);// objectconsole.log(typeof[]);// objectconsole.log(typeoffunction(){});// function

补充typeof结果的表格

Type of valResult
Undefined“undefined”
Null“object”
Boolean“boolean”
Number“number”
String“string”
Object (native and does not implement [[Call]])“object”
Object (native or host and does implement [[Call]])“function”
Object (host and does not implement [[Call]])Implementation-defined except may not be “undefined”, “boolean”, “number”, or “string”.

因为 typeof 无法判断数组和对象,所以需要新的方法去判断某个变量是对象还是数组。

3.2 判断变量是对象还是数组?

Array.isArray()是可以协助我们的方法。如果是数组,会回传true;但若是一般对象,则会回传false。举例来说:

Array.isArray([1,2,3]);// trueArray.isArray({foo:123});// false

我们也可以透过Object.prototype.toString()的方法帮助我们辨别数组、函数与一般对象。

constarr=[1,2,3];constfn=()=>{return123;};constobj={foo:123};console.log(Object.prototype.toString.call(arr));// [object Array]console.log(Object.prototype.toString.call(fn));// [object Function]console.log(Object.prototype.toString.call(obj));// [object Object]
版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/1/12 0:30:57

对比测试:M2FP在微pe官网风格页面中仍保持高解析稳定性

对比测试:M2FP在微pe官网风格页面中仍保持高解析稳定性 📌 引言:为何需要稳定的人体解析服务? 在当前AI视觉应用快速落地的背景下,多人人体解析(Human Parsing)已成为智能零售、虚拟试衣、安防…

作者头像 李华
网站建设 2026/1/11 18:03:46

Web前端如何对接M2FP?HTML+JS调用API完整示例

Web前端如何对接M2FP?HTMLJS调用API完整示例 📖 项目背景与技术价值 在计算机视觉领域,人体解析(Human Parsing) 是一项关键的细粒度语义分割任务,旨在将图像中的人体分解为多个语义明确的身体部位&#…

作者头像 李华
网站建设 2026/1/10 13:34:58

M2FP模型在多模态任务中的扩展可能性

M2FP模型在多模态任务中的扩展可能性 📌 引言:从人体解析到多模态智能的跃迁 随着计算机视觉技术的不断演进,语义分割已从基础场景理解逐步深入到细粒度的人体结构解析。M2FP(Mask2Former-Parsing)作为ModelScope平台推…

作者头像 李华
网站建设 2026/1/10 21:50:56

【dz-1121】基于单片机的智能洗衣机设计

基于单片机的智能洗衣机设计 摘要 随着生活品质的提升和智能家居理念的普及,洗衣机的智能化、个性化需求日益凸显。传统洗衣机存在功能单一、水位与时长控制粗放、缺乏精准感知与自适应调节能力等问题,难以满足不同衣物类型、污渍程度的清洗需求。因此&a…

作者头像 李华
网站建设 2026/1/11 22:09:24

【芯片验证的“数学证明”:形式验证(Formal)为何不可或缺?】

在芯片设计领域,一个微小错误可能导致数亿美元的损失——某个处理器漏洞曾让公司付出几亿美元的代价,阿丽亚娜5号火箭因软件错误发射后爆炸。这些惨痛教训让行业意识到:传统验证方法已不足以应对日益复杂的芯片设计。形式验证(For…

作者头像 李华
网站建设 2026/1/11 15:33:26

【风电光伏功率预测】从高精度气象到日前交易:用“15分钟预测+概率区间+风险预算”把收益抬高 2–4% 的超详细实战路径(可落地)

关键词:风电功率预测、光伏功率预测、新能源功率预测、日前交易、现货交易、报量策略、偏差考核、概率预测P10/P50/P90、15分钟气象预报、3km高精度气象、多源气象融合、NWP偏差订正、自然可发功率、可用容量AvailCap、限电识别、削顶clipping、ramp预警、储能协同、…

作者头像 李华