JavaScript

javaScript数据类型

字数:8013    阅读时间:41min
阅读量:5411

javScript数据类型简单分可分为基础数据类型和复杂数据类型;简单数据类型也称之为值类型,它是通过值进行存储的,不可以被改变只能被重写覆盖,在它上面没有方法;复杂数据类型的值是通过引用进行存储的,可以被改变(被改变的时候改变的是引用里边的值),有方法;

一、基础数据类型

1、String

文本文字使用引号引起来的都是字符串;

  • 字符串转换:
    • value.toString(进制),转换undefined和null时会报错
    • String(value),转换undefined和null时会返回undefined和null
    • 将一个值使用'+'和一个''拼接到一起时会自动转换成字符串
2、Number

数字类型;分为整数型和浮点型,不要测试某个浮点型的值(0.1+0.2!=0.3;可以乘10的倍数转换成整数,或者取一个精度值再判断);在转换一个不是数字的类型的时候有可能返回NaN,它是一个不等于本身的字符串,isNaN(value)可以用来判断是不是数字;

  • 数字类型转换:
    • Number(value); (null:0,undefined:NaN,true:1,false:0,"":0)
    • parseInt(value,进制) (整数转换,'22我i':22,"":NaN)
    • parseFloat(value)(浮点数转换)
    • + value
3、Boolean

布尔值类型;只有true和false两个值;多用于判断;undefined,null,0,-0,NaN,''只有这六种转换布尔值的时候是false;布尔值转换:Boolean(value);!!value

4、Undefined

空数据类型;未定义和未赋值的时候都返回undefined;undefined是window的一个属性;在做判断时,明确类型是undefined的时候再使用'===undefined'

5、Null

空数据类型;是一个空对象指针;在定义一个空变量的时候'var obj = null';判断是否相等使用'==null'

6、Symbol(ES6)

是ES6新增的基础数据类型;Symbol 可以创建一个独一无二的值(生成一个全局唯一的值 ,但并不是字符串);symbol(数据描述);主要解决对象属性名重复的话会覆盖原先的造成开发不便的问题;不能与其他数据类型进行计算

7.数据类型判断
  1. typeof:typeof是一个一元操作符(只能操作一个数据),只能判断基础数据类型,复杂数据类型只返回Object或者Function
  2. value instanceof 判断类型;返回布尔值;常用来判断是否是实例关系,因为instanceof检测的是__proto__原型链后都会指向Object,所以 instanceof不适合用来判断对象具体属于那种类型
  3. obj.constructor === 判断类型;返回的是布尔值;null和undefined会报错;因为constructor会被重写,所以并不是很可靠
  4. Object.prototype.toString.call() ; toString是Object原型对象上的一个方法,该方法默认返回其调用者的具体类型 ;因该是目前最可靠的方法了

二、复杂数据类型

常用复杂数据类型

1、Object

js对象是由一系列属性构成的无序列集合;获取对象属性:会先看前面是不是undefined或者null,如果是报错,如果不是对象,会把它转换成对象,如果是对象,以 'object.attr'方式获取对象属性,直接查询属性中有没有attr如果有就返回,如果没有就返回undefined,以'object[attr]'会先把[]里的值转换成字符串再判断对象里有没有该属性
对象的创建方式:

  • 创建Object实例:var obj = new Object()
  • 对象字面量:var obj = {}
  • 自定义构造函数:function Person(){};var obj = new Person()
2、Array

数组是一个有序的、可以保存任何数据类型的数据类型;
创建数组的方式:var arr = new Array(); var arr = [];
检测数组:Array.isArray(arr)返回的是布尔值,或者Object.prototype.toScript.call(arr);
常用方法:

  • 栈方法和队列方法:(改变原数组)
    • arr.push(value):在arr最后位置推入value,arr.pop():在arr移除最后一项
    • arr.unshift(value): 在arr最开始位置推入value,arr.shift():在arr移除最开始一项
  • 排序 (改变原数组)
    • reverse: 反转数组 ,arr.reverse()
    • sort():数组排序,
      function compare (a,b){
      if(a<b){return -1}else if(a>b){return 1}
      }
  • 操作方法
    • concat():数组拼接(不改变原数组) arr.concat(arr1)
    • join():返回的是拼接后的字符串,不改变原数组;
    • slice():数组截取(不改变原数组,返回截取的新数组) arr.slice(startindex,endindex)
    • splice(startindex,length,replace): (改变原数组,返回截取的新数组)
      • 增:arr.splice(2,0,'我是在位置2后添加的数据')
      • 删:arr.splice(2,3) 从位置2开始删除三个数据
      • 改:arr.splice(2,1,'我替换了2位置的数据')
    • copyWithin(changeIndex,copyStartIndex,copyEndIndex)(ES6新增):复制替换数组本身的一段数据 (改变原数组) ;copyWithin(开始改变的位置,开始复制的位置,结束复制的位置)
  • 查找方法
    • indexOf(value,index):返回从index首次查找到value值得下标,没有找到返回-1
    • lastIndexOf(value,index) :从index向前查找
    • includes(value,index):判断数组从index开始有没有包含value
    • find(function(){})(findIndex): 遍历数组,函数返回true就停止查找,并返回当前项 find返回的是当前项,findIndex返回的是当前项的索引;arr.find((item)=>{return item == 要找值})
  • 迭代方法
    • every():所有元素是否全部满足回调函数的条件,然后返回一个布尔值;arr.every(function(item,index,array){return item>0})
    • some() :只要有元素满足回调函数的条件就结束,返回一个布尔值 arr.some(function(item,index,array){return item>0})
    • filter():过滤符合回调条件的元素,返回一个数组; arr.filter(function(item,index,array){return item>0})
    • map():遍历所有元素,都执行一遍回调函数,返回一个数组;ary1.map( function(item,index,array) {return item+100})
    • forEach(): 遍历元素arr.forEach((item)=>{console.log(item)})
    • for of :遍历元素:for(let item of arr){console.log(item)};遍历key: for(let keyof arr.keys()){console.log(key) }
    • entries:遍历接口,每次便利都得到一个值和索引 for(let [item,index] of arr.entries()){console.log(item,index)}
  • 归并方法
    • reduce(function(prev,item){return item},10):迭代数组每一个值,可以记录上一次返回的值,第二个参数是初始值;
    • reduceRight():与reduce相同只不过是从右向左的

数据去重的几种方法

3、Date

创建Date的方式:var date = new Date();以1970.1.1 00:00为开始的UTC时间
获取时间戳:new Date().valueOf(); new Date().getTime(); +new Date(); Number(new Date()) ;获取指定日期时间戳:+new Date(日期)

  • 常用的获取日期方法
    • time.getFullYear() 获取年
    • time.getMonth() 获取月份,月份从0开始
    • time.getDay() 获取周几,周日是0
    • time.getDate() 获取日
    • time.getHours() 获取小时
    • time.getMinutes() 获取分钟
    • time.getSeconds() 获取秒数
4、RegExp

关于正则有很多东西要说,这里单独列出来:RegExp正则表达式

5、Function

Function就是一个对象;函数名就是一个指向函数对象的指针
函数的创建:

  1. 函数声明方式:function name(){} 函数的声明提前
  2. 匿名函数表达式方式:var name = function (){} ;不存在函数声提前;函数表达式使用情况:1.为变量赋值为函数2.属性为方法3.当作参数传递的时候,4.在语句块内使用
  3. 命名函数表达式方式:var name = function b(){};只可以在函数体内访问b函数,外边访问不到
  4. 箭头函数(ES6):()=>{}是匿名函数的简写;1.没有this指针,2.name是'',3.没有arguments
  5. 函数生成器(ES6):function *fn(){yield 'value';yield 'value';} var fun = fn();fun.next() 主要能记录上一次的状态 需要记录状态的时候使用
  6. 函数构造器:不推荐使用

函数的属性和方法

  • 函数内部对象:
    1. arguments:函数参数的一个集合,是一个类数组对象
      • callee 是一个指针,指向的是拥有当前arguements对象的这个函数 ;可以解决开发中函数名的耦合问题 arguments.callee
      • caller 也是一个指针,指向的是调用当前函数的那个函数;fn.caller或者arguments.callee.caller实现更加松散的耦合
    2. this :this指针指向的是操作当前函数的对象 (js中this指向问题 )
  • 函数的属性和方法:
    1. length :函数的length表示的是参数的个数
    2. prototype:每个函数都有一个prototype属性像toString(),valueOf()方法都存在里面
    3. 函数的方法:每个函数都有call()apply()bind()方法,这几个方法是用来改变this指针指向对象的值 ( js中call,apply,bind的用法和区别 )

js中的闭包

6、Set(ES6)

Set是ES6提供的新的数据结构类型;通过构造函数new Set()创建实例;类似数组,但是他的每一项都是唯一的没有重复;它的参数是数组或者有interable接口的(数组,类数组,元素集合,set,Map,字符串)
创建方法:let set = new Set(数据)

  • Set的查、增、删、清方法
    • has():set.has('haha') //返回的是布尔值 有没有该数据
    • add():set.add(1).add('我才是新加的') //原来有的是加不上的 一次只能加一个可以链式调用 返回的是增加过的实例
    • delate():set.delete(NaN) //删除一个数据 返回值是布尔值 如果有就删除成功返回true
    • clear():set2.clear() //清除set实例 返回的是undefined
  • Set的遍历方法:
    • forEach():set.forEach(()=>{})
    • keys():for(let key of set.keys()){} //得到的是每一项的索引
    • values():for(let item of set.values){} //得到的是每一项
    • entries():for(let item of set.entries()){console.log(item)} //每次都返回当前项的键和值的数组 但键和值都是当前项
  • Set的用途
    • 数组去重:[…new Set(arr)]
    • 并集:[…new Set([…arg1,…arg2])]
    • 交集:arg1.filter(item=>arg2.includes(item)) //用arg1过滤arg2中含有arg1item的项
    • 差集:并集.filter(item=>!交集.includes(item)) //差集 = 并集 - 交集
7、Map(es6)

Map是ES6提供的新的数据结构;通过构造函数new Map()创建实例;类似对象 ,但是它的键可以是任意类型的数据格式(Object键只能是string,不是string也会转为string);它的参数是一个数组,这个数组的每一项也是一个键和值的数组
let map = new Map([[eg1,222],[eg2,666]])

  • Map的获取、设置、查找、删除、清除方法
    • get():map.get(eg1) //获取键是eg1的值
    • set():map.set(eg1,'我把你修改了').set(undefined,'我是新来的') //第一个参数是键 查找有此键 就按照参数二的值修改 如果没有此键就新添一项 可以链式调用
    • has():map.has(eg1) 判断有没有键位eg1这一项
    • delate():map.delete(eg1) //删除eg1这一项 如果有这一项就返回true反之返回false
    • clear():map.clear() //清除map 返回undefined
  • Map的遍历方法
    • forEach():map.forEach(()=>{})
    • keys():for(let key of map.keys()){}
    • values():for(let item of map.values){}
    • entries():for(let [key,value] of map.entries()){console.log(key,value)}

基本包装类型

在基础数据类型(string,number,boolean)被调用方法的时候:1.后台会自动创建一个基础数据类型实例;2.调用这个实例上指定的方法;3.销毁这个实例;需要注意的是基本包装类型最后会被销毁

1、String
  • 基本方法:
    • valueOf()、toString()、tolocaleString都返回的是当前字符串;string有length长度属性
  • 查询方法:
    • charAt(index):返回的是指定位置的字符串;charCodeAt(index)返回指定位置字符编码
    • indexOf(str):返回的是从左向右某个字符串首次出现的位置;lastIndexOf(str)返回的是从右向左某个字符串首次出现的位置
  • 字符串截取:(都返回截取的字符串,不改变原字符串)
    • slice(startIndex,endIndex):从开始的位置截取到结束前位置的字符串(当截取字符串为负数时slice会用字符串的长度减去这个负数的得到的位置,开始位置大于结束位置会返回空)
    • substring( startIndex,endIndex ):与slice相同,只是当截取字符串为负数时substring直接返回0
    • substr():从开始位置,截取几个
  • 模式匹配方法:(里边参数都可以是正则或者字符串匹配模式,不改变原数组)
    • match():str.match('a');str.match(/a/)查找某个指定的字符串或者匹配模式,返回的是查找的字符串对象,包含index等属性 (没有找到会返回null)
    • search(): str.search('a');str.search(/a/)查找某个指定的字符串或者匹配模式 ,返回的是这个字符串的位置下标,没有找到就返回-1
    • replace():str.replace(d,'666');str.replace(/d/,'666')替换某个指定的字符串,返回的是替换过的字符串,如果没找到就返回原字符串
    • split():str.split(/,/);str.split(',');基于要分割的字符串,将分割的字符串放在一个数组里;参数为空的时候会把每一个字符串都放进数组里,返回的是一个字符串,字符串里没有包含要分割的字符串就将原数组放进数组里返回
  • 大小写转换
    • toLowerCase():str.toLowerCase();将字符串转换成小写
    • toUperCase():str.toUpperCase();将字符串转换成大写
  • ES6新增方法
    • includes():判断是否包含某个字符串,第二个参数是从哪个字符串开始,返回的是布尔值
    • startsWith(),endsWith():判断字符串是否以某个字符串开始或者结束, 返回布尔值 , startsWith() 第二个参数是从哪个字符串开始, endsWith()第二个参数是要检索的个数,从字符串开始计算
    • repeat():表示字符串重复的次数
  • 其他方法:
    • concat():字符串的拼接;一般还是用 '+' 拼接方便
    • trim():去除首尾的空格;trimLeft()去除左边空格,trimRight()去除右边空格
2、Number
  • number的一些方法
    • valueOf():返回的是数字本身的值
    • toScript():返回的是数字本身的字符串形式
    • toFixed(保留小数点后几位):返回的是保留几位数的字符串
    • toExponential(保留小数点后几位):返回的是以科学计数法显示的字符串
    • toPrecision(一共保留几位):小于整数部分的位数的时候使用科学计数法显示保留到那一位的字符串,大于等于整数部分的位数的时候就是保留多少位字符串
3、Boolean(用不到)
  • valueOf():new Boolean(0).valueOf() //返回的是true或false
  • toString():new Boolean(0).toString() //返回的是字符串'true'或'false'

内置对象

1、Global

它是一个访问不到的对象(兜底对象),在浏览器下Global可以看作是window对象

  • 处理数字的
    • isNaN():isNaN(str) 判断str是不是NaN
    • isFinite():isFinite(number) 判断是不是无穷
    • parseInt():解析一个字符串并返回一个整数,第二个参数是进制
    • parseFloat(): 解析一个字符串并返回一个小数,第二个参数是进制
  • 处理URI
    • encodeURI():对URI进行编码;对整个URI进行编码,不会对本身属于URI的特殊字符编码
    • encodeURIComponent():对URI的某一段进行编码,会对所有非标准的字符进行编码
    • decodeURI():解码,只能对使用encodeURI()替换的字符进行解码
    • decodeURIComponent(): 部分解码,只能对使用encodeURIComponent()替换的字符进行解码
  • eval() 新手不建议使用,很神秘,可读性差,会有性能问题,会有安全问题 但是它真的是一个很强大的属性,如果要用可参考:js中eval()的使用
2、Math
  • 常用的方法
    • Math.PI : π 值
    • Math.abs(): //绝对值
    • Math.ceil(2.4) : //向上取整
    • Math.floor(2.4) : //向下取整
    • Math.round(2.6) ://四舍五入取整
    • Math.random(): //返回0~1的随机数
    • Math.max(arr): //返回最大值
    • Math.min(arr): //返回最小值
野生小园猿
励志做一只遨游在知识海洋里的小白鲨
查看“野生小园猿”的所有文章 →

发表评论

邮箱地址不会被公开。

相关推荐