js数据类型

布满荆棘的人生 2021-09-07 06:02 454阅读 0赞

### 目录 ###

*  一、数据类型
 *  二.数据类型的分类
 *   *  1.基本数据类型
     *  2.引用数据类型
     *  3.数据类型的判断
 *  三、数据类型的操作
 *   *  1.数字类型
     *  2.字符串类型
     *  3.基本类型的转换

# 一、数据类型 #

数据类型就是用来形容数据是什么类型的。比如1，就是数字类型，‘1’就是字符类型。

# 二.数据类型的分类 #

js中，数据类型分为基本数据类型和引用数据类型。

## 1.基本数据类型 ##

基本数据类型一共有5中，分别是数字类型，字符串类型，布尔类型，undefined，null。  
数字类型就是数字，字符串类型就是双引号括起来的，布尔类型就是true或者false，undefined就是值为undefined，null就是值为null。一边基本数据类型就是所说的不变量，也就是常量。  
一个变量声明了未赋值，值就是undefined  
null表示值是空的，其实是有值的，值就是空，所以加1 就是1，加字符串就会变成null字符串

## 2.引用数据类型 ##

引用数据类型就是对象，常用的有数组对象，对象，事件对象等

## 3.数据类型的判断 ##

使用typeof关键词来判读一个数据是什么类型。

var a = 1
    var b = '1'
    var c = true
    var d = undefined
    var e = null
    var f = []
    var g = { }
    var h = new Date()
    console.log(a)   //number
    console.log(b)   //string
    console.log(c)   //boolean
    console.log(d)   //undefined
    console.log(e)   //object
    console.log(f)   //object
    console.log(g)   //object

需要注意的是null的数据类型是对象，这在学原型链可以知道，对象的最终原型是null。

# 三、数据类型的操作 #

## 1.数字类型 ##

1.数字一般没什么操作，直接使用即可。数字类型不分小数和整数，在js中小数和整数的类型都是Number,都是数字类型的。但是尽量不要判断小数之间的运算，有时候会不相等。浮点数在js中的计算精度远小于整数，要是非要浮点运算，要比你需要的小数位再往后拖两位，以防精度不够。

## 2.字符串类型 ##

字符串有长度length属性，一个字符的长度是1，修改原来的字符串，会返回一个新的字符串。

**1.获取指定位置的字符**

var a = '吮指原味鸡不要鸡腿'
    console.log(a.charAt(2))//打印的是’原‘
    //或者h5新增的，IE8+也支持
    console.log(a[2])//打印的也是’原‘

索引是从0开始的

**2.获取指定位置处字符的ASCII码**

var a = '吮指原味鸡不要鸡腿'
    console.log(a.charCodeAt(2))//打印的是21407

**3.拼接字符串**

var a = '吮指原味鸡'
    var b = '不要鸡腿'
    console.log(a.concat(b))//打印的是’吮指原味鸡不要鸡腿‘
    //字符串连接我们一般是用+号运算符连接
    console.log(a + b)//打印的也是’吮指原味鸡不要鸡腿‘

字符串和+号使用时无论后面的是什么都会变成字符串串形式拼接起来，对象形式的例外。

**4.截取字符串slice**

var a = '吮指原味鸡不要鸡腿'
    var c = a.slice(0,5)
    console.log(a) //打印的还是吮指原味鸡不要鸡腿
    console.log(c)  //打印的是吮指原味鸡

slice有两个参数，第一个参数是从什么位置开始，第二个是什么位置停止，但这个位置的是取不到，只能取前面一位，就是我们所说的左闭右开。  
slice方法不会影响原来的字符串返回的是一个新的字符串。

**5.截取字符串substring和substr**

var a = '吮指原味鸡不要鸡腿'
    var c = a.substring(0,5)
    var d = a.substr(5,4)
    console.log(a) //打印的还是吮指原味鸡不要鸡腿
    console.log(c)   //打印的是吮指原味鸡
    console.log(d)    //打印的是不要鸡腿

**substring**：第一个参数是从什么位置开始，截取到什么位置结束和slice一样。结束的位置是取不到。

**substr**：第一个参数是截取的开始的位置，第二个参数什么截取的长度。4就是4个字符。

**6.找到指定字符在字符串中的位置**

var a = '吮指原味鸡不要鸡腿'
    var d = a.indexOf('鸡腿')
    var c = a.indexOf('翅')
    var e = a.lastIndexOf('鸡腿')
    var f = a.lastIndexOf('翅')
    console.log(d)  //7
    console.log(c)  //-1
    console.log(e)  //7
    console.log(f)  //-1

**indexOf**:是找从左往右第一个匹配的字符位置,之后返回一次。  
不存的字符会返回-1。

**lastIndexOf**：是从左往右找最后一次出现的匹配的字符位置。不存在的字符返回-1

**7.去除字符串前后的空白**

var a = ' 吮指原味鸡不要鸡腿 '
    var d = a.trim()
    console.log(a) 
    console.log(d)

![20210117000006774.png_pic_center][]

此时a还是有空格的，  
而b没有前后的空格了

**8.转换大小写**

var a = "kFc"
    var b = a.toUpperCase()
    var c = a.toLocale()
    console.log(b) //KFC.
    console.log(c) //kfc

toUpperCase()是转换成大写  
toLocale()是转换成小写

**9.替换指定字符**

var a = ' 吮指原鸡不要鸡腿 '
    var b = a.replace('鸡','鸭')
    console.log(b) // 吮指原味鸭不要鸡腿

replace会替换第一次匹配的字符串，替换指定的字符。

**10.打印单引号**  
因为单双引号在括起来的就是字符串，有时我们想打印双引号或单引号时会出现打印不出来，可以用转义字符\\

var a = " \"吮指原味鸡不要鸡腿\" "
    console.log(a)  // "吮指原味鸡不要鸡腿"

打印单引号我们可以用双引号来括住字符串

var a = " '吮指原味鸡不要鸡腿' "
    console.log(a) // '吮指原味鸡不要鸡腿'

或者也可以用转义字符。  
\\r 表示回车  
\\n表示换行

**3.undefined**  
**4.null**  
**5.NaN**

## 3.基本类型的转换 ##

一般都是将字符串,boolean,undefined和null转数字,或者  
数字，字符串，undefined和null转boolean较多。其他类型转字符串直接拼接一个空字符串 " "即可。  
下面主要记录转数字问题。

**1.parseInt()转换**

var a = 1
        var b = '112'
        var c = '吮指原味鸡不要鸡腿'
        var d = ''
        var e = '112吮指原味鸡不要鸡腿'
        var f = '吮指原味鸡不要鸡腿112'
        var g = 'true'
        var h=  'false'
        var i = true
        var j = false
        var k = undefined
        var l =null
        var m = 1.123
        console.log(parseInt(a)) //1
        console.log(parseInt(b)) //112
        console.log(parseInt(c)) //NaN
        console.log(parseInt(d)) //NaN
        console.log(parseInt(e)) //112
        console.log(parseInt(f)) //NaN
        console.log(parseInt(g)) //NaN
        console.log(parseInt(h)) //NaN
        console.log(parseInt(i)) //NaN
        console.log(parseInt(k)) //NaN
        console.log(parseInt(l)) //NaN
        console.log(parseInt(m)) //1

parseInt()是将数据类型转换为数字类型，它是从左往右开始转换，知道遇到不是数字的字符。数字还是数字，但是小数类型的只去整数，它不能识别小数点，不能转为数字的字符都变成了NaN, not a number。  
综上：只去字符串前缀是数字的部分。

**1.parseInt()转换**

var a = 1
        var b = '112'
        var c = '吮指原味鸡不要鸡腿'
        var d = ''
        var e = '112吮指原味鸡不要鸡腿'
        var f = '吮指原味鸡不要鸡腿112'
        var g = 'true'
        var h=  'false'
        var i = true
        var j = false
        var k = undefined
        var l = null
        var m = 1.123
        console.log(parseFloat(a))  //1
        console.log(parseFloat(b))  //112
        console.log(parseFloat(c))  //NaN
        console.log(parseFloat(d))  //NaN
        console.log(parseFloat(e))  //112
        console.log(parseFloat(f))  //NaN
        console.log(parseFloat(g))  //NaN
        console.log(parseFloat(h))  //NaN
        console.log(parseFloat(i))  //NaN
        console.log(parseFloat(k))  //NaN
        console.log(parseFloat(l))  //NaN
        console.log(parseFloat(m))  //1.123

综上，parseFloat和parseInt差不多，只是parseFloat能识别小数点。

**3.boolean转换**

var a = 1
        var c = '吮指原味鸡不要鸡腿'
        var d = ''
        var g = 'true'
        var h=  'false'
        var i = true
        var j = false
        var k = undefined
        var l =null
        var m = 1.123
        var n = { }
        var o ={ name:"qq"}
        var p =[]
        var q = [1,3,4]
        var r = 0
        var s ='0'
        console.log(Boolean(a))//非0数字为true
        console.log(Boolean(c))//非空字符串为true
        console.log(Boolean(d))//空字符为false
        console.log(Boolean(g))//true字符串为true
        console.log(Boolean(h))//false字符串为true
        console.log(Boolean(i))//boolean类型的true就是true
        console.log(Boolean(j))//boolean类型的false就是false
        console.log(Boolean(k))//undefined就是false
        console.log(Boolean(l))//null就是false
        console.log(Boolean(m))//小数也是true
        console.log(Boolean(n))//空对象也为true
         console.log(Boolean(o))//不为空的对象是true
        console.log(Boolean(p))//空数组为true
        console.log(Boolean(q))//非空数组也为true
        console.log(Boolean(r))//数字0是false
        console.log(Boolean(s))//字符串0也是true

综上：在转boolean时，数字类型中，只有0是false,  
字符串都是true,undefined是false,null也是false,引用类型都是true。  
在判断语句中，都隐式的进行了一个boolean的转换。可以根据这个来看。

4.Number转换

var a = 1
        var c = '吮指原味鸡不要鸡腿'
        var d = ''
        var g = 'true'
        var h=  'false'
        var i = true
        var j = false
        var k = undefined
        var l =null
        var m = 1.123
        var n = { }
        var o ={ name:"qq"}
        var p =[]
        var q = [1,3,4]
        var r = 0
        var s ='0'
        console.log(Number(a))//数字还是数字
        console.log(Number(c))//非空数字字符串变成了NaN
        console.log(Number(d))//空字符串是0
        console.log(Number(g))//NaN
        console.log(Number(h))//NaN
        console.log(Number(i))//true是1
        console.log(Number(j))//false是0
        console.log(Number(k))//undefined是NaN
        console.log(Number(l))//null是0
        console.log(Number(m))//小数还是原来的
        console.log(Number(n))//空对象是NaN
        console.log(Number(o))//非空对象是NaN
        console.log(Number(p))//空数组是0
        console.log(Number(q))//非空数组是NaN
        console.log(Number(r))//数字0是0
        console.log(Number(s))//字符串0是0

综上：数字类型的转换，还是原来的。非纯数字字符串转数字，都是NaN,数字类型的字符串会变成数字，true是1，false是0，null是0，undefined是NaN,引用类型中空数组是0，其他是NaN

[20210117000006774.png_pic_center]: /images/20210813/9f693908626f4356a4491e694dc817ab.png