JS的数据类型
创始人
2025-05-30 09:41:43
0

系列文章目录

前端系列文章——传送门
JavaScript系列文章——传送门


文章目录

  • 系列文章目录
  • 1、前言
  • 2、类型检测
  • 3、数字类型
    • 3.1、了解内容
      • 3.1.1、不同进制的数字
      • 3.1.2、科学计数法
      • 3.1.3、数值范围
    • 3.2、重点内容
      • 3.2.1、NaN
      • 3.2.2、小数
  • 4、字符串类型
    • 4.1、引号问题
    • 4.2、js输出标签
    • 4.3、字符串的拼接
  • 5、对象类型
  • 6、undefined类型


1、前言

思考:如何输出一句话?

// 在页面上显示:你好,世界!
document.write(123456)
document.write(你好,世界!)

此时浏览器会报错:

你好,世界! is not defined

这个报错表达的意思是说,将“你好,世界!”识别为了一个变量,但是这个变量没有定义过。

也就是说变量在定义的时候,变量的名字还可以使用中文:

var 我 = 123;
console.log(我);

这样也是可以的,但是建议不要使用中文汉字作为变量名。

那怎样才能输出上面的中文汉字一段话呢?我们需要给这段话加引号:

console.log("你好,世界!");

从上面的示例中,可以看到,输出数字不需要加引号,但是输出一段话就需要加引号,也就是说,数据有时候不需要加引号,但有时候就需要加引号,这是因为数据的类型不一致造成的。

js中可以输出数字,输出一段带引号的话,还可以输出哪些数据?

数字、带引号的数据、没有赋值的变量、true、false、[]数据、{}数据、null

根据他们的用途和特性,可以将数据分为以下几类:

类型示例备注
数字型(number)1 -2 3.14 300包括整数、小数、负数
字符串型(string)“你好吗?” ‘今天嫁给我’用引号引起来的任意多任意字符,单引号和双引号都行
布尔型(boolean)true false代表事物的两面性,真和假
未定义型(undefined)var a代表定义过未赋值的变量
对象(object)null [1,2,3] {name:张三}代表一个集合

2、类型检测

使用typeof(被检测的内容)可以得出一个内容的类型。

console.log(typeof(-123456)); // 数字型
console.log(typeof("明天会更好")); // 字符串型
console.log(typeof(true)); // 布尔型
console.log(typeof(x)); // 布尔型
console.log(typeof([1,2,3])); // 对象
console.log(typeof({name:"张三",age:12})); // 对象
console.log(typeof(null)); // 对象

多学一招:typeof(x) 可以写成 typeof x 。使用小括号和空格都可以。

3、数字类型

在结果中可以看到使用number来代表数字类型。

3.1、了解内容

3.1.1、不同进制的数字

我们一般使用使用的数字是十进制的,但是在js中我们还可以使用八进制和十六进制。

var a = 010; // 8进制
var b = 0xA; // 16进制
var c = 0xb; // 小写字母和大写字母都可以
console.log(a); // 8
console.log(b); // 10
console.log(c); // 11

3.1.2、科学计数法

数字的表达当中,有一种叫科学记数法,js中的数字也可以使用科学记数法来表示

//当一次数字很大的时候,可以用科学计数法来表示
var num = 3e+5;  //3乘以10的5次方
var num = 5e-3;//5乘以10的-3次方

3.1.3、数值范围

内存大和小有什么区别呢?存储的数据多和少的区别。那计算机存储数据是没有限制的吗?不是,计算机能表达的数字也有极限值:

最小值:Number.MIN_VALUE,这个值为: 5e-324
最大值:Number.MAX_VALUE,这个值为: 1.7976931348623157e+308
无穷大:Infinity    1/0
无穷小:-Infinity

3.2、重点内容

3.2.1、NaN

var a = "abc";
var b = 2;
var c = a - b;
console.log(c); // NaN

NaN: not a number, 表示一个非数字

在js中,NaN用来表示一个非数字的特殊值,当发现无法进行运算时,js不会报错,而是会返回一个NaN

NaN的注意事项:

  • NaN的类型是number类型的,表示一个非数字
  • NaN不等于任何值,包括NaN本身
  • 通过isNaN()可以判断是否是一个数字,返回false的时候,表示是一个数字。
var a = 123;
var b = "abc";
console.log(isNaN(a)); // false
console.log(isNaN(b)); // true

3.2.2、小数

计算机中的小数在进行运算的时候,有时会碰到小数点精度不准确的现象

//在进行浮点数运算的时候,可能会出现精度丢失的问题
0.1 + 0.2 = 0.30000000000000004;
0.2 + 0.2 = 0.4;

原因:

计算机内部所能识别的数据只有二进制,当我们进行10进制数字运算的时候,在计算机内部需要先将数据转为2进制,然后运算,再将结果转为10进制给出来。10进制的小数进行2进制转换的时候,根据转换规则,有些小数会进行无限死循环,最终在后面数字太多的时候只能四舍五入,所以其实最终并没有很精确的转为2进制,所以只能给出一个大概的值。有时候会有两个大概的值相加,在转换10进制的时候正好能转换了,也会计算的比较精准。

consoloe.log(0.2 + 0.2) // 0.4

也不绝对,如果小数是2的n次方分支m的话,计算机内部存储的就比较准确。

console.log(0.125 + 0.5) // 0.625

解决办法:

// 解决办法 : 
// 1.根据小数点后面的位数量 乘以对应的整数;
0.1 + 0.2  ==> (0.1*10+0.2*10) / 10 = 0.3
// 2.使用toFixed工具强制保留小数点后位数
var a = 0.1 + 0.2
console.log(a.toFixed(3)) // 0.300

4、字符串类型

字符串所使用的引号,在js中,单引号和双引号是没有区别的,使用哪个都一样。

字符串中的字符是任意字符,即只要在键盘上能输入的字符都是可以的。

单引号和双引号也是字符串的字符:

var str = '"' // 一个双引号字符的字符串
var str1 = "'" // 一个单引号字符的字符串

4.1、引号问题

但是双引号中不能包含双引号,单引号中不能包含双引号,因为引号对于字符串来讲是有特殊含义的,就是给字符串做边界,双引号定义的字符串,在字符串中碰到第一个双引号,就认为将前面的双引号结束了,单引号同理。

但在某些特殊情况下,双引号就需要嵌套双引号,单引号就需要嵌套单引号:

var str = '我说对妈妈说:"我学会了第一个代码'hello world'"';
console.log(str)

这个字符串在输出的时候是会报错的,因为,浏览器是这样解析这个字符串:

'我说对妈妈说:"我学会了第一个代码'   hello world   '"';

中间的汉字和两边的字符串之间并没有拼接,不符合js的语法,所以报错。

此时,关键的原因就是单引号字符串中碰到了第一个单引号,就将前面的单引号结束了,因为引号对于字符串是有特殊含义的。

解决方案:

给字符串中的引号转义,也就是将引号对于字符串的特殊含义去掉,就剩下普通字符的含义即可。转义是给引号前加反引号\

var str = '我说对妈妈说:"我学会了第一个代码\'hello world\'"';
console.log(str)

4.2、js输出标签

js可以输出标签,让页面中的元素具备标签的特性,但是在输出标签的时候一定要将标签当做字符串输出。

document.write('你好,世界!')

输出标签可以看出,每次输出,其实就是在body内容原本的基础上直接追加了,也就是说,一个标签可以分多次输出,结果和输出一次是一样的。

4.3、字符串的拼接

用变量代替每一次的输出:

var a = '';
var b = '文字倾斜';
var c = '';
document.write(a)
document.write(b)
document.write(c)

如果我们在此时希望能一次输出的话,就需要将多个变量连接在一起,组成一个更大的字符串才行,字符串之间的连接使用拼接符:+

var a = '';
var b = '文字倾斜';
var c = '';
document.write(a + b + c)

也就是说,字符串和字符串之间的 + 是可以将两个字符串连接在一起组成大字符串的。

5、对象类型

object类型,在js中有3种表现形式,分别是:

  • null
  • 用[]定义的数据
  • 用{}定义的数据

6、undefined类型

当一个变量定义好了,但是没有给这个变量赋值,也就是没有给这个容器中放入数据,这个变量的默认值就是undefined,类型也是undefined。

相关内容

热门资讯

ESP8266-NodeMCU... 目录 安装 ESP8266-NodeMCU开发板驱动 为ESP8266-NodeMCU搭建Ardui...
揭阳最新学区划分,最新或202... 揭阳公办小学招生范围按照义务教育免试就近入学原则,市区公办小学实行依街道划片招生。本文为您介绍揭阳小...
云浮最新学区划分,最新或202... 云浮公办小学招生范围按照义务教育免试就近入学原则,市区公办小学实行依街道划片招生。本文为您介绍云浮小...
东莞最新学区划分,最新或202... 孩子的入学教育,已经成为中国家长们心中不可绕过的一道坎。小编特意为家长们整理了《 最新或2023(历...
潮州最新学区划分,最新或202... 近日,教育部首次在官方文件中提出,针对择校冲动强烈的地方实施“多校划片”。一时间,大家围绕“学区房真...
中山最新学区划分,最新或202... 太阳教育网小编为您整理了关于中山市幼升小学区划分详情的相关信息,希望对您有帮助,想了解更多请继续关注...
MySQL的COUNT语句,竟... 关于数据库中行数统计,无论是MySQL还是Oracle,都有一个函数可以...
一文讲解电源技术中的安森美深力... 一文讲解电源技术中的安森美深力科NCP1680AAD1R2G NCP1680是一个CrM PFC控制...
阳江最新学区划分,最新或202... 南恩学校一、马南湾南路、环城北路、北门街、横石街和东边巷以东,西平路、东门路以西,环城东路、万福路以...
清远最新学区划分,最新或202... 清远公办小学招生范围按照义务教育免试就近入学原则,市区公办小学实行依街道划片招生。本文为您介绍清远小...
河源最新学区划分,最新或202... 在河源房地产市场,以前人们买房往往更关心周边他们环境和商业配套,教育配套曾经一度被忽略。近几年来,虽...
Python基础(二十一):a... 简介argparse 模块主要用于处理 Python 命令行参数和选项,程序定义好所需...
用Pytorch构建第一个神经... 本文参加新星计划人工智能(Pytorch)赛道:https://bbs.csdn.ne...
俞敏洪:家庭教育的灵魂是人品教... 我之所以能够在这谈谈家庭教育的心得,确实是因为我接触的孩子太多了。我看到过很多幸福的学生,也看到了很...
汕尾最新学区划分,最新或202... 汕尾公办小学招生范围按照义务教育免试就近入学原则,市区公办小学实行依街道划片招生。本文为您介绍汕尾小...
最新或2023(历届)小外面试... 朴新晟嘉教育全市16大分校快速提分,94%名校录取率暑期特价班50元/科语数英108小时开始正式报名...
让老人带孩子到底好不好?如何打... 年轻父母忙于工作,无暇照顾孩子,越来越多的家庭成了隔代教育家庭。那么让老人来带孩子到底好不好?究竟该...
Oracle目录应急清理 Oracle目录应急清理清理错误位置的归档日志清理30天前的监听告警日志清理监听日志清理30天以前的...
最新或2023(历届)小升初作... 著名教育家苏霍姆林斯基说过:“应该让孩子生活在书籍的世界里”。北大资深教授钱理群先生:“学好语文有很...
光电器件——光电半导体器件简介... 首先我们进入光电器件的简介 主要由三五族来形成无机光电半导体 我们用二六族来形成的话,...