JavaScript中的数据类型（笔记，略许潦草，不建议观看）

基本数据类型与引用数据类型

javascript中的数据类型主要有两种分别为基本数据类型(简单数据类型或值类型)和引用数据类型(复杂数据类型)。

• 简单数据类型：在存储时变量中存储的是值本身
  • Number(数字)、String(字符串)、undefined(未定义)、null(空)、Boolean(布尔值)
• 复杂数据类型：在存储时变量中存储的仅仅是地址(引用)
  • 通过new关键字创建的对象(系统对象、自定义对象)，如Object、Array、Date等

栈和堆

基本数据类型存放在栈里面，引用数据类型存放在堆里面。

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-k0xgDakI-1660124910050)(E:\待完成\Snipaste_2022-06-28_17-17-46.png)]

• 引用数据类型获取数据时，是根据变量查找栈空间的地址，通过地址再查找到堆空间中的数据。

数据类型的传参方式

简单数据类型传参

当我们把一个基本数据类型作为参数传递给函数，仅仅是把栈空间的值复制了一份给形参，因此在函数内部对形参做任何修改，都不会影响到外部的变量。

function fn(a) {
    a++;
    console.log(a); /* 11 */
}
let num = 10;
fn(num);
console.log(num); /* 10 */
1
2
3
4
5
6
7

复杂数据类型传参

当我们把引用数据类型传给形参时，其实是把栈空间里保存的堆空间地址给了形参，形参和实参其实保存的是同一个堆空间地址，所以操作的是同一个对象。

function Person(name){
    this.name = name
}
function fn1(x){
    console.log(x.name); //李四
    x.name = '张三';
    console.log(x.name); //张三
}
let p = new Person('李四');
console.log(p.name); //李四
fn1(p);
console.log(p.name); //张三
1
2
3
4
5
6
7
8
9
10
11
12

基本包装类型

基本包装类型：把简单数据类型包装成复杂数据类型，这样基本数据类型就有了属性和方法。

javascript中可包装的基础数据类型可分为：Number、String、Boolean。

• 例如下

// 获取字符串的长度
let str = 'ting';
console.log(str.length);   /* 4 */

//简单数据类型为什么会有length属性呢？

//1.把简单数据类型包装为复杂数据类型
var temp = new String('andy');
//2.把临时变量的值赋值给 str
str = temp;
//3.销毁这个临时变量
temp = null;
1
2
3
4
5
6
7
8
9
10
11
12

Number 数字方法

1. parseInt()取整[把字符型转换为数字型，得到的是整数]

   取整，自动过滤小数点以后数字以及过滤掉字符串为数字开头的后面的非数字的字符集

   若字符串第一个字符为非数字直接返回NaN

   第二个参数为进制数，列：2,8,10，16

   console.log(parseInt(3.9));   	  //3
   console.log(parseInt('120px'));   //120
   console.log(parseInt('ting123')); //NaN 错误
   1
   2
   3

   数据转换失败结果为 NaN[错误]

2. parseFloat()[把字符型转换为数字型，得到的是浮点数；若字符类型为整数，则为整数]

   取数值，不会过滤小数点以后的数字以及过滤掉字符串为数字开头的后面非数字的字符集

   若字符串第一个字符为非数字直接返回NaN

   第二个参数也为进制数。

   console.log(parseFloat('3.52'));    //3.52
   console.log(parseFloat('120px'));   //120
   console.log(parseFloat('ting123')); //NaN
   1
   2
   3

3. Number()[强制把内容转换为数字型]

   1. 布尔值，true转换为1，false转换为0
   2. 数值，直接返回
   3. null，返回0
   4. undefined，返回NaN
   5. 字符串，数字字符串自动转化，浮点数自动过滤，十六进制默认转换为十进制，空字符串返回0，其它皆是NaN。

   console.log('120px');   //NaN
   console.log('120.2');   //120.2
   1
   2

4. -、*、/隐式类型转换

   console.log('10'-9);    /* 1 */
   console.log('100'*'2'); /* 200 */
   console.log(9/'3');     /* 3 */
   1
   2
   3

+属于字符串拼接

String 字符串方法

• 基础数据类型转字符串的方法

  • toString()、String()、+

    console.log(typeof (100).toString());   //string 值为100
    console.log(typeof String(120));        //string 值为120
    console.log(typeof (100 + '10'));       //string 值为110
    1
    2
    3

Undefined 与 Null的区别

• undefined表示变量初始化时未赋值，null表示有值暂为空。

Boolean中五个检测为false的条件

console.log('');   //false
console.log(0);    //false
console.log(NaN);  //false
console.log(undefined);//false
console.log();     //false
1
2
3
4
5

所有数据类型只有此五种转为Boolean为false

---

引用数据类型

Array 数组

数组（Array）：一组数据的集合，存储在单个变量下的优雅方式。

基本使用

1. 创建数组+获取数组元素

索引（下标）：用来访问数组元素的序号（数组下标从0开始）。

注：数组中的类型是没有限制的。

let arr1 = new Array();   // 利用new创建数组
let arrs = new Array(2); /* 数组的长度为2，里面有两个空的数组元素 两个值以上表示为正常 */
let arr2 = [1,null,'ting',true];   //字面量的方式创建数组
console.log(arr2[2]);    //ting(通过索引获取数组中的元素)
1
2
3
4

2. 数组的扩容

• 通过修改length长度新增数组元素

let arr = [1,2,3];
arr.length = 5;
console.log(arr);   //1,2,3,empty*2
console.log(arr[3]);   //undefined
1
2
3
4

• 修改索引号

let arr = [1,2,3];
arr[arr.length]=4;
console.log(arr);   //1,2,3,4
1
2
3

索引号被占用为替换元素，未被占用则为追加元素。

Object 对象

对象是一组无序的相关属性和方法的集合

属性：事物的特征(常用名词)[当前对象的特征描述]

方法：事物的行为(常用动词)[当前对象的作用]

对象的作用：保存一个值，可以使用变量，保存多个值，可以使用数组，保存一个人的完整信息，需要使用对象

创建对象的方式

1. 字面量形式 创建对象

let perent = {
    name: '张三',
    age: 22,
    spa: function(){
        console.log('脑壳疼');
    }
}
console.log(perent.spa);
1
2
3
4
5
6
7
8

注：

1. 定义对象
   • 对象内的属性和方法，需要采取键值对的形式。
   • 多个属性或者方法中间使用,隔开
   • 方法冒号后面跟的是一个匿名函数
2. 使用对象
   • 调用对象的属性 对象名.属性名(.可以理解为的)
   • 调用对象的属性也可这样书写 对象名['属性名']
   • 调用对象的方法对象名.方法名()
3. 变量和属性的区别
   • 相同点：都是用来储存数据的
   • 不同点：
     • 变量 单独声明并赋值，调用时直接写变量名 单独存在
     • 属性 在对象里面，不需要声明 调用时必须是对象名.属性名
4. 函数和方法的区别
   • 相同点：都是实现某种功能的
   • 不同点：
     • 函数 单独声明 调用时 函数名() 单独存在的
     • 方法 在对象里面，且必须是匿名函数 调用时必须是 对象名.方法名()

2. new Object 创建对象

let obj = new Object();
obj.name = 'ting';
obj.age = 22;
obj.speak=function(){
    console.log('1224')
}
console.log(obj.name);
console.log(obj['age']);
obj.speak();
1
2
3
4
5
6
7
8
9

• 利用=赋值的方法，添加对象的属性和方法
• 每个属性和方法之间使用;分隔

3. 构造函数 创建对象

利用函数的方法，重复的创建对象

//1. 构造函数名字首字母要大写
//2. 构造函数不需要 ``return`` 就可以返回结果
//3. 调用构造函数必须使用 ``new`` 关键字 
function Star(uname,age,sex) {  
	this.name = uname;
	this.age = age;
	this.sex = sex;
	this.sing = function (sang){
		console.log(sang)
	}
}
let ting = new Star('张三',18,'男');/* Star为构造函数名 */
ting.sing('法律讲坛')
1
2
3
4
5
6
7
8
9
10
11
12
13

4. new 关键字执行过程

   1. new 构造函数可以在内存中创建一个空的对象
   2. this 就会指向刚才创建的空对象
   3. 执行构造函数内的代码，给这个空对象添加属性和方法
   4. 返回这个对象