一、基本数据类型
string 字符串
- string.lenght 返回字符串长度
- concat(val1,val2) 连接字符串
- indexOf(substring) 检索字符串的子串,返回index
- substr(start,lenght) 抽取从index开始到lenght长度的子串
- substring(startIndex,endIndex) 抽取从index开始到index结束的子串
- charAt(index) 抽取index位置的子串
- slice(start,end) 抽取从index开始到end结束的子串
- toLowerCase() 将字符串转为小写
- toUpperCase() 将字符串转为大写
- trim() 去除字符串两边空格
- trimLeft()/trimRight() 去除字符串左/右边空格
- localeCompare(target) 用本地特定顺序来比较两个字符串
- replace(regexp,newSubstr) 替换一个与正则表达式匹配的子串
- split() 将字符串分割成字符串
// 字符串中的转义符
\n 换行
\t 制表,也是空格作用
\b 是空格
\\ 是斜杠
\' 是单引号
\" 是双引号
Number 数字类型 (整数/浮点数)
创建方式 new Number()
属性
- Number.POSITIVE_INFINITY Infinity 正无穷大
- Number.NEGATIVE_INFINITY -Infinity 负无穷大
- 最大值 Number.MAX_VALU 1.7976931348623157e+308
- 最小值 Number.MIN_VALUE 5e-324
方法
- parseInt() 将其他串类型的值转换成Number整数,舍弃小数,不是整数也会舍弃掉.
parseInt("12ddg") // 12
parseInt(0.9) // 0
- parseFloat() 将其他类型装换为Number浮点数,即小数.
parseFloat("20.52346") // 20.52346
- isNaN() 是否是非数字, 是非数字返回true,是数字返回false.
- isInteger() 是否是整数,是true,否false
- toString() 是否把数字转为字符串
- Number() 数值转换
参数类型
string
字符串都是数字的话转为十进制数字;
字符串有非数字放回NaN;
如果前缀0x数字,表示十六进制;
空字符转返回0.
null 返回0
undefined 返回NaN
boolean
true 返回1
false 返回0
- Number.toFixed(n) 保留小点数的n位数,且转为字符串
2.1023.toFixed(3)** // 保留3个小数点 2.102
Null 空对象
指向一个空对象,表示没有引用任何对象
null == undefined // true
null === undefined // false
注意点:虽然null是基本数据类型,但是检测数据类型会显示object, 这是一个存在很久的bug
console.log(typeof null) // object
//解决
Object.prototype.toString.call(null) == '[object Null]' // true
undefined
定义了变量,但是没有赋值
Boolean
| false | true | |
|---|---|---|
| string | Boolean("") | Boolean('任意string') |
| number | 0/NaN | 非0 |
| object | null | 任何对象 |
| undefined | undefined |
Symbol
Symbol 是es6引入的心的基本数据类型,表示独一无二的值;
- 当对象的属性名为Symbol类型,表示属性名的唯一性,避免和其他属性名重复冲突
- 需要注意,Symbol是原始类型的值,不是对象,故不需要通过new
- 通过Symbol()函数生成,接受一个字符串参数,表示对Symbol实例的描述,用于区分
const sym = Symbol('Symbol实例的描述')
console.log(sym,typeof sym) // Symbol(Symbol实例的描述) "symbol"
- 因为Symbol的唯一性,Symbol()与Symbol()之前哪怕参数相同,也是不相等的
console.log(Symbol('1') === Symbol('1')) // false 唯一性,故参数相同情况是不相等的
- es2019版本提供description 属性 返回Symbol的描述
console.log(sym.description) // Symbol实例的描述
- 设置变量的属性名为Symbol,能防止此键被不小心改写或覆盖
- 对象的属性名为Symbol时,调用不可使用点运算符引用,需要通过obj[key]
let fun = Symbol()
let symObj = {
[sym]:'value' , // 设置变量的属性名为Symbol,能防止此键被不小心改写或覆盖
sym:'普通value',
[fun](a,b){ // 设置方法的属性名为Symbol [fun]:function(a,b)
return a+b
}
}
console.log(symObj) // {sym: "普通value", Symbol(Symbol实例的描述): "value", Symbol:ƒ}
console.log(symObj[sym]) // value // 不可用点运算符
console.log(symObj.sym) // 普通value
console.log(symObj[fun](1,2)) // 3
- Symbol 值作为属性名时, for...in、for...of丶Object.keys()、Object.getOwnPropertyNames()、JSON.stringify() 都不会返回symbol成员
- Object.getOwnPropertySymbols 获取对象中为Symbol类型的属性名,返回数组
console.log(Object.getOwnPropertySymbols(symObj)) // [Symbol(Symbol实例的描述), Symbol()]
BigInt
大整数,只表示整数,没有位数限制,为了和nmber区分,BigInt必须添加n后缀
二、引用数据类型
Object
属性
- object.lenght
- object.prototype 指向object函数的原型对象
方法
- for(let i in obj){} 对象的遍历
- Object.assign(target,…sources) 合并对象(浅拷贝)
target -- 目标对象
sources -- 源对象
返回目标对象
let obj1 = {name: '123'};
let obj2 = {age:18,}
Object.assign(obj1,obj2); // {name: "123", age: 18,}
- Object.keys(obj) 返回所有key组成的数组
- Object.values(obj) 返回所有value组成的数组
- key in object 检测object中是否有指定的key值
let obj = { one:'1' , two:'2'}
console.log("one" in obj) // true
Array
属性
- Array.lenght 数组长度
- Array.prototype
方法
- for(let i of arr){} 数组的遍历
- Array.join(separator) 将数组元素转为string,默认用分隔符进行分隔,或者自定义separator分隔
- Array.concat() 连接两个或者更多的数字,并且返回数组
['one','two'].concat(['three'],['four']) // ["one", "two", "three", "four"]
- Array.from() 将类数组对象转为数组
let setarr = new Set([1,1,'one','one'])
Array.from(setarr) // 去重
[...setarr] // 去重
...展开运算符
[...['one','two'],...['three'],...["four"]] // ["one", "two", "three", "four"]
- Array.includes() 判断一个数组是否包含一个指定的值
- Array.push() 向数组末尾添加元素,返回数组长度
- Array.unshift() 向数组头部添加元素,返回数组长度
- Array.pop() 移除数组最后一个元素,返回删除的元素
- Array.shift() 移除数组第一个元素,返回删除的元素
- Array.slice(start,end) 截取数组,放回截取的数组,不会影响原数组
- Array.splice(start,deletCount,items) 数组剪接,增删改
- Array.reverse() 翻转数组,返回翻转结果
- Array.sort() 对数组的元素进行排序,按(数字/字母)进行升/降序
sort() 默认按照字符串升序排序
[11,2,1].sort() // [1, 11, 2]
自定义升降序
[11,2,1].sort((param1,param2)=>{
// return param1 - param2 // 升序
return param2 - param1 // 降序
})
- Array.isArray() 判断对象是否是一个数组
- Array.reduce() 迭代所有的元素最终返回一个值
- Array.forEach() 数组每个元素都执行一次回调
- Array.map() 数组映射,符合条件的数据通过return赋值
- Array.indexOf() 搜索数组的元素,返回下标
- Array.lastIndeOf() 从末尾开始搜索数组的元素,返回下标
- Array.filter() 数组过滤
- Array.flat() 数组拉平(一层)
- Array.flatMap() 数组拉平(多层)
[1,2,[3,4]].flat()
[1,2,[3,[4,5]]].flatMap()
- Array.reduce(callback(accumulator, currentValue, currentIndex, arr),initialValue)
accumulator 累计器
currentValue 当前值
currentIndex 当前索引
arr 数组
initialValue 如果没有提供此参数,accumulator取值数组第一个元素,currentValue取值第二个数组
如果提供此参数,accumulator取值initialValue,currentValue取值第一个数组
let arr = [1,4,5]
let arr2 = arr.reduce((accumulator,value,index)=>{
return accumulator + value
}) // 如果为},2) one为12
console.log(arr2) // 10
Function
- 无参函数
function 方法名(){} - 有参函数
function 方法名(参数){} - 带返回值函数
function 方法名(){ return 返回值 } - 匿名函数
(function(){})
匿名函数的定义方式
事件驱动 window.onclick = function (){}
使用变量 var fun = function(){}
创建后立即调用 ( function(){}() )
- 箭头函数
()=>{}
return的作用:退出当前函数,并且从函数重返回一个值.
Date 日期数据类型
- getFullYear() 获取年份
- getMonth() 获取月份(0-11) 故需要+1
- getDate() 获取月份中的某一天(1-31)
- getHours() 获取小时(0-23)
- getMinutes() 获取分钟(0-59)
- getSeconds() 获取秒(0-59)
- getDay() 获取一周中的某一天
- getMilliseconds() 获取毫秒(0-999)
- getTime() 获取1970/1/1到至今的毫秒数
- get 改为set 设置
RegExp正则表达式
1.修饰符 可以在全局搜索中不区分大小写
| 修饰符 | |
|---|---|
| i | 执行对大小写不敏感的匹配 |
| g | 执行全局匹配(查找所有匹配而非在找到第一个匹配后停止) |
| m | 执行多行匹配 |
2.表达式模式
- 方括号[] 用于查找某个范围内的字符
| [abc] | 查找方括号之间的任何字符 |
| [abc] | 查找0-9的数字 |
| [A-Z] | 查找26个大写英文字母 |
| [A-Za-z0-9] | 查找数字和26个大小英文字母 |
(x|y) 查找任何以|分隔的选项
- 元字符
| ^ | 匹配字符串的开始(在集合字符里[^a]表示非(不匹配)的意思 |
| $ | 匹配字符串的结束 |
| . | 匹配除换行符以外的任意字符 |
| \w | 匹配字母或数字或下划线或汉字 |
| \s | 匹配任意的空白符 |
| \d | 匹配数字 |
| \b | 匹配单词的开始或结束 |
- 反义字符
| \W | 匹配任意不是字母,数字,下划线,汉字的字符 |
| \S | 匹配任意不是空白符的字符 |
| \D | 匹配任意非数字的字符 |
| \B | 匹配不是单词开头或结束的位置 |
| [^x] | 匹配除了x以外的任意字符 |
| [^abi] | 匹配除了abi 这几个字母以外的任意字符 |
- 量词
| * | 重复零次或更多次 |
| + | 重复一次或更多次 |
| ? | 重复零次或一次 |
| {n} | 重复n次 |
| {n,} | 重复n次或更多次 |
| {n,m} | 重复n到m次 |
实例
\d* 匹配重复0次或者多次数字 (可能为空或者任意数字)
\d? 可能为空或者任意一个数字
\d{4} 匹配重复8次数字,比如1234
\d{4,} 匹配至少4次数字
- 转义符
在实际开发中,如果遇到比配元字符的情况,像 . * \
则需要通过\进行转换为\. \* \\
- 字符分枝
多用于满足不同情况的选择,用“|”将不同的条件分割开来
比如有的电话区号是3位数,有的4位数
\d{3}-\d{8}|\d{4}-\d{8}
xxx-xxxxxxxx
xxxx-xxxxxxxx
- 贪婪匹配
贪婪匹配:正则表达式中包含重复的限定符时,通常的行为是匹配尽可能多的字符。
先匹配整个字串,然后一个个回退,直到找到匹配为止,最耗资源
- 懒惰匹配
匹配尽可能少的字符
| *? | 重复任意次,但尽可能少重复 |
| +? | 重复1次或更多次,但尽可能少重复 |
| ?? | 重复0次或1次,但尽可能少重复 |
| {n,m}? | 重复n到m次,但尽可能少重复 |
| {n,}? | 重复n次以上,但尽可能少重复 |
3.RegExp对象
创建RegExp对象 new RegExp(pattern,modifiers)
pattern 是一个字符串,正则表达式的模式
modifiers 修饰符 用于指定全局匹配、区分大小写的匹配和多行匹配
三、数据类型检测
typeof() 检测数据类型
Array.isArray() 检测是否为数组
Array和Object通过typeof()检测出来都会是object类型,可通过此法进行区分
Array.isArray([]) // true
Array.isArray({}) // false
constructor
[].constructor == Array
{}.constructor == Object
new Date().constructor == Date 等
instanceof
console.log([] instanceof Array,[] instanceof Object); // true true
console.log({} instanceof Array,{} instanceof Object); // false true
{} instanceof Array // 如果为false 则数据为object,否则为array
Object.prototype.toString.call() 判断一个对象类型的最好的办法
Object.prototype.toString.call([]) // [object Array]
Object.prototype.toString.call({}) // [object Object]
Object.prototype.toString.call(new Date()) // [object Date]
// null有个bug,检测会是object类型,可通过此法进行检测区分
Object.prototype.toString.call(null) == '[object Null]' // true