本文详细介绍了JavaScript中的变量声明、命名规范以及基本和引用数据类型，包括number、string、boolean、null、undefined、object（普通对象、数组、正则、日期）和function。还探讨了变量的声明方式、命名规范以及各种数据类型的特性和转换方法。
系列文章目录
第二章JS入门到入土之变量及数据类型
提示：写完文章后，目录可以自动生成，如何生成可参考右边的帮助文档
目录
（3）/^[+-]?(\d|([1-9]\d+))(\.\d+)?$/ 正则对象
（4）wed sep 09 2020 11:58:24 GMT+0800(中国标准时间) 日期对象
前言
本文对JS的变量以及数据类型做出系统化的整理。
提示：以下是本篇文章正文内容，下面案例可供参考
一、JS中的变量及声明方式
1.变量与常量
-
变量：可变的量
-
常量：不能改变的量，一个具体的值
2.声明变量的方式 declare
- 传统方案：var/function
- 新方案：let/const/import
二.命名规范
- 基于数字/字母/下划线/$ 命名
- 数字不可以是名字的开始
- $一般会作为名字的开始，很少会放到中间（放中间不会报错）
- 约定俗成的特点：
- (1)$开始的变量一般用来JQ获取的值
- _开始的变量一般代表全局或者公共的
- 基于驼峰命名法：
- 复杂名称由多个单词拼接成（单词的简拼）
- 第一个单词首字母小写
- 其余每一个有意义单词的首字母大写
- 语义化要明显，少使用a/b/c等无意义的字母
- 不能使用关键字和保留字
- 关键字：JS中个有特殊含义的（例如：var/let/const/function）
- 保留字：未来会成为关键字，现在保留下来的
三、JS中的基本数据类型
简单数据类型：number、string、boolean、undefined、null
复杂数据类型：Array、function, Object
简单数据类型也叫值类型，复杂数据类型也叫引用数据类型，这主要是根据内存存储方式来区分的。
- 变量在存储简单类型的时候，存的是值本身（值类型）
- 变量在存储复杂数据类型的时候，存的是引用，也叫地址（类型）
1.数字number
在JavaScript代码中，数字型变量的使用非常广泛，它也是最基本的类型，但它的与其他语言的数字类型不同，它并不区别整数型和浮点型，而是统称为浮点型，这种类型既可以表示整数，也可以表示小数，同时还能使用指数形式表示更大或更小的值。
//定义多种形式的数字类型的变量
var intAge=28;
var fltX=23.45;
var intBig=50e5;
var intSml=50e-5;
在上述代码中，数字变量intAge是整型，它以十进制形式来表示，包括正整型、负整型和零；数字变量fltX是一个带有小数点的数据，如果想要表示更大或更小的整型，可以使用指数的方式，变量intBig的值为50乘以10的5次方，而intSml则表示更小的值。
number中有正数/负数/零/小数。其中+Infinity 代指正无穷大的值-Infinity 代指负无穷大的值
- NaN（not a number）不是一个有效的数字，但是它却属于number类型
- NaN==NaN；//false NaN和NaN本身都不相等（它和谁都不相等）
- isNaN（[value]:检测一个值[value]是否为’有效数字‘,如果是有效数字返回true，反之返回false（隐式转换（浏览器默认私下处理，在隐式转换中，浏览器是基于Number([value])实现数据类型转换的）：如果[value]并不是数字类型的值，则浏览器默认会把[value]转换成数字类型）
- 字符串转换为数字：空字符串是0，如果字符串中出现任意一个为非有效数字字符，会出现NaN
- 布尔转换为数字：true-》1，false-》0
- null-》0
- nodefined-》NaN
- symbol值不能转换为数字（会报错）
- bigint 可以转换为数字
Number([value])： 把其他数据类型转换为number数字数据类型
- 引用数据类型（对象或者函数）转换为数字：首先获取他的[Symbol.toPromitive]属性值，如果没有这个属性，其次获取他的valueOf（原始值），如果还是没有原始值，最后把其转换为字符串（string），然后再转换为数字Number
parseInt/parseFloat([value])：把其他数据类型转换为数字类型
- 需要保证[value]是一个字符串，如果不是则首先“隐式”把其转换为字符串 [value].toString(),从字符串左侧第一个字符开始向右查找，把找到的有效数字字符，最后转换为数字（遇到一个非有效数字字符则停止查找，不论后面是否还有有效数字字符，都不再找了），如果一个有效数字字符都没找到，结果是NaN
[number value].toFixed（[N]）：保留小数点后面N位
2.字符串String
字符串是由Unicode字符、数字、标点符号等组成的序列，在JavaScript代码中用于表示JavaScript文本的数据类型，字符串型数据通常由单引号或双引号包裹，由双引号定界的字符串中可以再包含有单引号，单引号定界的字符串中也可以再包含有双引号。
1. 双引号界定的字符串内容
//双引号界定的多个字符内容
varstrInfo="今天的天气非常好";
//双引号界定的单个字符内容
varstrI="好";在上述代码中，使用双引号界定字符串型的数据是代码开发中十分常见的一种方式，被界定的内容可以单个或多个汉字、字母或其他字符，一旦被界定符包裹，即使是数字，它也变成了字符，因此，它是字符串型数据定义的常用标识符。
2. 单引号界定的字符串内容
//单引号界定的多个字符内容
var strMess='明天的天气非常好';
//单引号界定的单个字符内容
var strM='好';出于简化代码的考虑，开发人员在定义字符串型数据类型时，也常常使用单引号，它的功能与双引号符相同，既可以包括单个，也可以包含多个字符串的内容。
3. 双引号界定的字符串中包含单引号内容
//双引号界定的字符串中包含单引号的内容
var strTip="后天的天气一定很'好'";出于文本数据中突出和格式的需求，有时在双引号的字符串中又要包含单引号的内容，这种方式也是被允许的，但要注意编写时的成对顺序，如上述代码所示。
4. 单引号界定的字符串中包含双引号内容
//单引号界定的字符串中包含双引号的内容
var strTip='后天的天气一定很"好"';无论是单引号，还是双引号，都必须是在输入法是拼音和字母的情况下输入，否则，引号将无效，如需要在双引号中再次显示双引号的字符或在单引号中再次显示单引号的字符，则需要使用转义符，代码如下所示：
//双引号界定的字符串中包含双引号的内容
var strTip="后天的天气一定很\"好\"";
//单引号界定的字符串中包含单引号的内容
var strTip='后天的天气一定很\'好\'';所谓的转义符，是指以“\”反斜杠为开始标记的特殊字符，它可以将一些字符通过增加反斜杠的方式进行转义，因此，反斜杠又称转义符，它后面的字符就是发生转义的内容，如上述代码中的“\"”或“\'”表示，将双引号“"”或单引号“\'”显示在字符串中。
通过提供的转义符，既可以丰富代码编写的内容，又能在字符串中添加一些不方便显示的字符，防止引号匹配引起的混乱，常用转义符的功能对应表格如下表1所示。
表1 常用转义符的功能对应表格
| 转义字符 | 功能说明 |
| \b | 退格 |
| \n | 回车换行 |
| \t | Tab符号 |
| \f | 换页 |
| \' | 单引号 |
| \" | 双引号 |
| \v | 跳格（Tab，水平） |
| \r | 换行 |
| \\ | 反斜杠 |
一个字符串是由零到多个字符组成的，每一个字符都有一个自己的位置“索引”，有一个length存储字符串长度。
- 从零开始，逐级递增
- 索引0是第一个字符
- str[索引]获取指定索引位置的字符
- 最后一个字符的索引 length-1
反引号`` （ES6新增的模板字符串，有助于字符串的拼接 ）
${}存放的是JS表达式（执行代码可以有返回的结果的，例如变量/三元运算符...）
把其他数据类型转换为字符串类型 [value].toString()/String([value])
- 基本上都是用双引号或者单引号包起来即可
- 数组转换为字符串，是把数组中的每一项用逗号分隔
- 对于普通对象{}来讲，转换为字符串的时候，不论对象中包含哪些信息，结果都是“[object Object]”
3.布尔类型 Boolean
与数字类型的值不同，布尔型变量的值只有固定的两种表示方式，一种是true，另一种是false，前者表示真，后者表示假，如果用数字表示，那么，true可以使用1来表示，false可以使用0来表示，布尔型变量的值来源于逻辑性运算符，常用于控制结构流程。
//定义一个布尔类型的变量并赋值初始值
var blnAdd=false;
//根据变量的值决定结构流程
if(blnAdd==true){
//变量值为真时执行的代码
}else{
//变量值为假时执行的代码
}在上述代码中，布尔型变量blnAdd的值是false，接下来根据这个变量的值，来执行不同的代码块，因此，布尔型变量的核心作用是用于控制JavaScript代码的结构流程。
此外，可以使用Boolean函数，将一些字符和数字及对象转变成布尔型值，在转变过程中，不等0、不是空字符串和对象都可以转成true值，否则为false值，如下代码所示：
//不为空的字符串转换后的值为真
var blnX1=Boolean("a");
//不为零的数字转换后的值为真
var blnX2=Boolean(1);
//对象转换后的值为真
var blnX3=Boolean(new Object());
//空的字符串转换后的值为假
var blnX4=Boolean("");
//为零的数字转换后的值为假
var blnX5=Boolean(0);
//null和undefined转换后的值为假
var blnX6=Boolean(null);在实际的代码开发过程中，使用Boolean函数获取布尔类型值的场景并不是太多，大部分都先定义一个布尔类型的变量，然后修改变量的值，最后，根据该值控制流程。
4.空 null
在JavaScript代码中，空值型是一个比较特殊的类型，它只有一个值，就是null，当引用一个未定义的对象时，则将返回一个这个null值， 从严格意义上来说，null值本质上是一个对象类型，是一个空指针的对象类型，如下代码所示。
//定义一个Null类型的对象变量
var objNull=null;
//在控制台输出对象变量的类型
console.log(typeof objNull);
//显示object在上述的代码中，变量strNull的类型为Null，因此，当使用typeof函数检测时，将返回一个空指针的对象，这种情形是JavaScript最初实现的一个错误，后来被ECMAScript一直沿用下来，简单来讲，null值就是一个不存在的对象的占位符。
根据上述对空值型的描述，建议它的应用场景是：如果需要定义一个空值的对象，在初始化该对象时，可以直接赋值null。
5.未定义 undefined
与Null型相同，Undefined型也是只有一个undefined值，当在编写JavaScript代码时，如果定义了一个变量，但没有给它赋值，那么，这个变量将返回undefined值，这也是变量默认的值，与Null型不同之处在于，Null型是一个空值，而Undefined型表示无值。
//定义一个变量但不赋值
var strUndefined;
//在控制台输出变量的类型
console.log(typeof strUndefined);
//显示undefined在上述代码中，虽然变量strUndefined定义了名称，但它并没有被赋值，因此，当使用typeof函数检测时，它返回了undefined值，表示未定义型。
需要进一步说明的是，ECMAScript认为undefined是从null派生出来的，因此，两者类型的值在表面上是相等的，即null==undefined返回true，但它们的类型并不相同，所以，两者并不完全相等，即null===undefined将返回false。
四、引用数据类型
1.对象类型 object
与前面的基本类型不同，对象型变量保存的内容更多，更容易处理复杂的业务，因此，更加受到开发人员的钟爱，在定义对象型变量时，以花括号界定，括号中以key/value的形式来定义对象中属性的内容，各属性之前使用逗号隔开，如下列代码所示：
//定义一个保存用户基本信息的对象
var objInfo={
code:0,
data:{
name:'Zeus',
sex:'男',
age:20
}
}
//使用对象.属性名称的方式获取对象值
console.log(objInfo.data.name)
//显示tgrong
//使用对象[属性名称]的方式获取对象值
console.log(objInfo["data"]["name"])
//显示tgrong在上述代码中，对象型变量objInfo有两个属性值code和data，后者又是另外一个对象，它定义了name，sex，age三个属性值，形成多层嵌套的效果，用于处理复杂的数据请求，此外，可以采用对象.属性名称或对象[属性名称]的方式访问对象中的属性值。
（1）{key:value,.....} 普通对象
对象是由零到多组“键值对”（属性名和属性值）组成的
- 属性名（键）不是变量，它是对象的一个属性（特征）
- 属性名一般都是一个字符串（当然也可以是数字或者Symbol等基本数据类型），对于Symbol类型的属性名，需要基于[]包裹起来，保证语法正确性
- 属性名不能是对象或者函数，对象或者函数作为属性名，浏览器会把其转换为字符串作为属性名
管理一个对象的成员
1.直接编写在大括号中的（对于Symbol或者对象类型的属性名，再以及需要把一个变量存储的值作为属性名，需要基于中括号包裹起来，保证语法的正确性）
例子：
var symb = Symbol（‘xx’）；
var obj ={
name：‘天使’，
0:10，
symb：‘xxxx’//属性名就是“symb”，而不是这个变量存储的值
[symb]:'xxxx'// 属性名是Symbol（‘xx’），等同于把变量存储的值作为属性名}2.基于JS动态管理成员（新增/修改/删除）
对象的成员是不允许重复的 （0和‘0‘是按照相同的成员处理的），在动态管控的时候，之前有这个成员则是修改成员的属性值，没有这个成员才是给对象新增一个成员
获取一个对象中某个属性名对应的属性值“对象的成员访问
-
- 对象.属性名：这种方式不适用于“数字或者Symbol的类型”的属性名，这样的情况只能基于对象[属性名]来访问
- 对象[属性名]：这种方式必须制定好属性的类型 “obj[name]”和obj["name"]不是一个情况“
注意：console.log(obj.age)访问对象的某个成员，如果当前成员没有在对象中，不会报错，访问到的结果是undefined而已。console.log(age)如果是访问一个不存在变量，则会报错
特殊对象：数组或者类数组对象（集合）
属性名（成员/键）是数字，而且数字从零开始，逐级递增 =》有顺序和规律的数字属性名被称为“索引”：记录每一项的位置信息的
有一个length成员，存储集合的长度
（2）[value1,......] 数组对象
（3）/^[+-]?(\d|([1-9]\d+))(\.\d+)?$/ 正则对象
（4）wed sep 09 2020 11:58:24 GMT+0800(中国标准时间) 日期对象
2.函数类型 function
函数：一个方法，可以实现一个功能。
函数的要求：低耦合，高内聚。减少页面中的冗余代码，提高代码的重复使用率
创一个函数需要提供入口和出口：
入口（形参/实参）：封装一个功能的时候，想实现这个功能，发现很多东西都是不知道的，需要用这个方法的时候，用户手动的传递才能知道。
出口（返回值）：把基于功能处理的结果，让用户拿到。
逻辑或||和逻辑与&&
- A||B 首先看A是真还是假，如果A是真返回A的值，如果A是假返回B的值
- A&&B 首先看A是真还是假，如果A是真返回B的值，如果A是假返回A的值
- 只有“0/NaN/空字符串/null/undefined”是假，其余都是真
匿名函数（没有函数名）
函数表达式：把创建的函数当作值，赋值给变量或者其他内容
自执行函数：创建函数和执行函数一起完成
（function （x）{
}）（100）
（function （x）{}）中存放的是创建的函数，（100）是函数执行
注意：（function （x）{}）小括号把函数包裹起来可以解决语法错误的问题，在前面加~、+、-、！也都可以让语法正确
创建函数
function sum（x，y）{
return
}sum函数名（等同于变量，也是声明一个sum变量，只不过存储的值是一个函数）
x或者y：形参（变量），它是函数提供的一个入口（原因：封装这个功能，很多信息此时不清楚，执行时候用户传递给我才清楚）
ES6中的形参赋值默认值：设定形参不传递值，走等号后面的默认值，但是一旦传递值了（undefined除外），不论传递什么都不会走默认值
{ ....}函数体：编写具体功能代码的区域
return：不写return或者return后面什么都没有，默认返回值都是undefined
注意：sum-》f sum（x,y）{}函数本身
sum（）-》函数执行，代表的是函数执行后返回到结果（看return）
执行函数=》（实参1，实参2，....）
sum{10,20}实参（具体的值）：就是给函数的形参变量传递的具体值
闭包的机制：当前上下文中的私有变量是受到保护的，不能在上下文以外直接的访问
需求：执行函数的时候传递实参值，但是传递多少个实参“不确定”，我们想接受函数传递的实参信息
设定形参变量：但是需要知道传递实参的数量和顺序
函数内置实参集合arguments：不论是否传递以及传递多少实参（不管是否设定形参），在集合中包含了所有传递的是实参信息
不传递就是一个空集合
这个集合是一个“类数组”
ES6中“...”剩余运算符：函数形参中的剩余运算符，可以获取到，除前面设定形参变量接收到的实参外，剩下的实参都放到这个集合中
如果一个形参变量都没有定义，则所有传递的实参信息都存到这个集合中这个集合是一个“数组”集合
ES6中“创建函数”的新方式：“箭头函数” 所有箭头函数都是函数表达式创建方式
创建函数的语法不一样
执行函数是一致的
箭头函数中没有arguments（只能使用剩余运算符了）
var fn=（...params）=>{};总结
本文简单介绍了JavaScript中的变量以及数据类型，有什么错误请在评论区下方进行留言，欢迎大家批评指正
1154
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
