Fade away

Appearance

变量和数据类型 ​

1.变量 ​

变量，就是一个会变化，其值可以改变的量

1.1 变量的声明 ​

JS中声明变量必须用 var

常用语法：var 变量名 = 值;

js
// 先声明后赋值 
// 声明一个变量 
var num; 
// 为该变量赋值 
num = 10; 
// 将数字10赋值给变量num1 
// 同时声明并赋值
// 声明一个变量stuName并为其赋值 
var stuName = 'tom'; 
// 不声明直接赋值
// 将数字20赋值给变量num2 
num2 = 20;
// 不推荐
//一次性声明多个变量并赋值(值不一样时) 
var num1=1,num2=2,num3=3； 
//一次性声明多个变量并赋值(值一样时)
var num1=num2=num3=100； 
// 一次性声明多个变量后赋值 
var num1,num2,num3; num1 = 10; num2 = 20; num3 = 30;

1.2 变量的命名规范 ​

我们可以为每一个变量取不同的名称，这些名称能够很好的帮助我们快速的理解变量里所存的值代表了什么，所以JS对变量的命名有一套严格的规范。

  • 变量名也叫：标识符

  • 只能由数字、字母、下划线和$符号组成，但是不能以数字开头

  • 不可以使用JS中的关键字和保留字

  • 关键字：被JS语言赋予了特殊含义的单词

  • 保留字：现在还没有被JS使用，但是将来可能会被使用的单词

注：关键字和保留字比较多不需要立马全部记住，经常查看文档即可。

但是针对 top、new、this、delete需要记住严格区分大小写

我们的推荐：

  • 变量名需要见名知意

  • 使用驼峰式和下划线式命名法

  • 驼峰： myClassName

  • 下划线： my_class_name

2.数据类型 ​

2.1 数据类型分类 ​

在JS语言中数据类型可以分为两大类：

基本数据类型：

  • String：字符串
  • Number：数字
  • Boolean：布尔
  • Null：空
  • Undefined：未定义
  • Symbol：唯一值
  • bigInt：大整数

引用数据类型：

  • 对象：Object
  • 可调用/执行对象「函数」：function
  • 标准特殊对象：Array、Date、Math、RegExp、Error……
  • 非标准特殊对象：Number、String、Boolean……

基本数据类型与引用数据类型它们的赋值与取值有区别的。请看下面的代码：

js
//基本数据类型
var num1 = 10;
var num2 = num1;
num2 = 15;
console.log(num1);  // 10
console.log(num2);  // 15


//引用数据类型	
var arr1 = [1,2,3,4];
var arr2 = arr1;
arr2[2] = 10;
console.log(arr1);   // [1, 2, 10, 4]
console.log(arr2);   //[1, 2, 10, 4]

通过上面的案例我们可以很清晰的发现基本数据类型num2从num1里面取值，后续对num2的操作不会影响到num1，但是引用数据类型的数组则不同，对arr2的操作也会影响到arr1，这是为什么呢？

这一点就要从 基本数据类型 和 引用数据类型 的在内存中的存储位置来分析了

  • 基本数据类型指的是简单的数据段，变量名和数据的值都存储在**栈（stack）**中
  • 引用数据类型指的是有多个值构成的对象，值存储在**堆（heap）**中，变量名和堆地址存储在栈中

原始类型：变量赋值，栈开辟内存直接存数据 -> 数据互不影响

对象类型：变量赋值，栈开辟内存，存放堆地址 -> 数据相互影响

2.1 数据类型的判断 ​

typeof ​

typeof可以判断基本数据类型的数据类型，但相对于引用数据类型，的出来的结果都是object

对于null，得出的结果是object

js
let num=111
console.log(typeof(num))
console.log(typeof num)

Object.prototype.toString.call() ​

鉴于typeof的局限性，想要精准判断数据类型，此方法式不二之选

js
/**
 * 
 * @param {any} val 需要判断的数据
 * @returns  返回精确的数据类新
 */

function getType(val){
   return Object.prototype.toString.call(val).slice(8,-1)
}

instanceof ​

用于测试对象的prototype属性是否出现在对象的原型链中的任何位置

语法：obj instanceof constructor

js
let arr=[1,2]
let o=22
console.log(arr instanceof Array);  // true
console.log(o instanceof Array);  // false

​

3.数据类型的转换 ​

3.1 强制类型转换---显式转换 ​

3.1.1 转换为string ​

String() ​
js
const num=12345
const str=String(num)
toString() ​

直接调用变量的toString()方法，变量不能是空值（null）并且也不能是undefined

js
const num=12345
const str=num.toString()

3.1.2 转换为number ​

将得到的数据转换为number类型我们需要以下三个方法：

Number() ​

  • 如果内容可以转换成数字，则返回对应的数字（整数或小数）

  • 如果内容不可以转换成数字，则返回NaN

  • 如果内容为空，则返回0

parseInt() ​

  • 将内容转换成整数（直接去掉小数）

  • 从第一位开始检查，数字直接转换，直到第一个不是数字的内容就去掉

  • 第一位就不是数字的，直接转换为 NaN

  • 不认识小数点，最终的结果只会是整数

parseFloat() ​

  • 将内容转换成小数

  • 从第一位开始检查，数字直接转换，可以认识一次小数点，直到第一个不是数字的内容就去掉

  • 第一位就不是数字的，直接转换为 NaN

注意：parseInt和parseFloat解析会从第一字符进行解析，直到遇到不能被解析的字符为止，返回已经被解析的内容。

3.1.3 转换为boolean ​

将得到的数据转换为number类型我们可以使用：

Boolean() ​
  • false、0、NaN、Undefined、null、空字符串 会被转换成false
  • 其它的都会被转成true（任何非空字符串都会被转换为true）

注意：

  • Boolean值在内存中true为1，false为0
  • 字符串'0'转化为布尔值为true，数字0转化为布尔值为false

3.2 自动类型转换---隐式转换 ​

3.2.1 转换为string ​

  • + 号两边只要有一个是字符串，都会把另外一个转成字符串

3.2.2 转换为number ​

对数字类型的自动转换我们可以使用：

  • 直接在要转换的内容前加上”+”;

  • 可以使用-、*、/、%、>、<等将字符串转换成number

3.2.3 转换为boolean ​

对于boolean类型的自动转换有很多操作可以实现，暂时我们学习过的有：逻辑运算符 ! 的操作。

js
!12;// false 
!1;// false 
!'hello';// false 
!!'hello';// true 
!!123;// true

MIT Licensed

Copyright © 2024-present xarzhi