2.JavaScript
变量/对象
声明
var - 绑定到window,无法清理,且重复声明会污染全局(尽量不用)
let - 只在 let 命令所在的代码块 {} 内有效
const - 与let类似但它是只读常量,值不可修改
增删改查
let obj={}//创建对象
obj.a=1//新增属性a,值为1
obj['1']=1//新增属性1,值为1(可以在属性为数字时使用)
obj.a=2//修改a的值为2
obj.a//查询a的属性(若属性为数字可以使用[]查询)
obj//查询obj的所有属性
delete obj.a//删除obj的a属性
console.log()//在控制终端输出括号内容
进阶操作
Object.assign(obj1,obj2)//将obj1的所有属性拷贝到obj2
let {a} = obj1//将obj1的a属性解构出来
?.——let b = obj1?.a//即使obj1为undefined或者null也不报错
??——let b = a??c//a为undefined或者null则使用c赋值b,否则使用a
||——let b = a||c//在上一行代码的基础功能上对a进行布尔值判断,true返回a,false返回c,参考文档
??=——b??=c//若b为undefined或者null则用c赋值b否则b还是本身
forin——idea自动补全,循环对象属性
for (const objKey in obj) {
console.log(objKey+"="+obj[objKey])
}//遍历并输出对象的属性与属性值
数组
声明数组——let array =[1,'a']//声明了一个名为array的数组,内容为array[0]=1,array[1]='a'
增删改查
let arr = []//创建数组arr
arr[0] = 1 arr[2] = 3//直接使用下表增加/修改
arr[0]//查询arr[0]的值
push()//在数组最后增加一项
unshift()//在数组开头增加一项
pop()//删除最后一项
shift()//删除第一项
string.split()//将字符串分隔成数组,
splice[1]拼接
splice(x,y)//从第x项开始向后删除y项
splice(x,y,a,b,c,)//删除之后新添加a,b,c...等新元素,
splice可以同时实现添加、修改、删除等功能
slice截取
array1 = array2.slice(x,y)//从array2中截取第x项到第y项(左闭右开)作为新数组array1(y为空则是x之后所有项)
concat合并
let arr3 = arr1.concat(arr2)//合并数组arr1和arr2,合并后arr1元素在前
let arr1 =[0,1]
let arr2=['ew','dw']
let arr3 = arr1.concat(arr2)
split字符串转数组
将字符串转为数组
let str = 'asdasdasd'//声明字符串str
let arr = str.split('')//将每个字符都分隔
let arr4 = str.split('a')//以a为标识分隔
分隔符不会被识别进数组
let str = 'aaaaasdaaaasdaaasd'//声明字符串str
let arr = str.split('aa')//以aa为标识将每个字符都分隔
开头识别出几个分隔符就有几个'',之后连续识别出n(n$\geq$2)个分隔符时会输出n-1个''
数组转字符串
join()——将数组的','转为括号内的内容,括号内没东西则不转换
let arr = [0,1,2,3,'',4]
let str =arr.join()//原样输出
let arr = [0,1,2,3,'',4]
let str =arr.join('')//取消间隔,''项不显示
let arr = [0,1,2,3,'',4]
let str =arr.join('|')//将','转为'|'
sort 排序
sort会改变原数组,括号内可以编写排序方法,默认以unicode编码排序
let arr = [0,1,2,3,'',4,'!','asd',15,21,19,'你好',143]
console.log(arr.sort())
.sort((a,b) => a-b)将数字从小到大排序
let arr = [0,1,2,3,'',4,'!','asd',15,21,19,'你好',143]
console.log(arr.sort((a,b) => a-b))
indexOf查找元素下标
indexOf(a)——查找数组内的a元素并返回对应下标,如果没有找到就返回-1,如果存在多个相同元素则只返回第一个的下标值,如果使用lastIndexOf则会返回最后一个的下标值
forEach
let user = [{id:0,name:'张三',age:20},{id:1,name:'张三',age:21},{id:2,name:'李四',age:21}]//声明包含三个对象的数组
user.forEach(v=>{
//遍历user数组中的每一个元素,v为形参
})
user.forEach((item,index)=>{
//相较于第一种会额外记录每一个元素的下标
})
filter快速筛选
不影响原数组,返回数组
let newuser= user.filter(v=>v.age===21)//筛选出user中所有age为21的元素
=>右边的为筛选条件,符合筛选条件的元素会生成一个新的数组newuser
user=user.filter(v=>v.age!==21)//删除user中所有age为21的元素
使用该技巧可以快速删除数组中符合筛选条件的元素(由于是引用拷贝,暂不确定会发生什么问题)
find寻找符合的元素
不影响原数组,返回对应元素
如果存在多个符合要求的元素,则只能返回第一个
let obt =user.find(v=>v.age===21)
不存在则返回undefine
findIndex返回下标,同样是只能返回第一个,不存在则返回-1
map生成遍历条件的数组
let array =user.map(v=>v.name+'a')
将user中所有对象的name属性输出成新数组array,且每一项后面都加上字符串a
与filter组合使用可以输出符合筛选条件的对象的另一项属性
let username = user.filter(v=>v.age===21)//筛选出age为21的对象
let nameList = username.map(v=>v.name)//输出这些对象的name组成的数组
reduce
针对数组的一个方法,可用于计数、求和
- 语法:arr.reduce(function(prev,cur,index,arr){...}, init);
- prev 累计器累计回调的返回值,表示上一次调用回调时的返回值,或者初始值 init
- cur 表示当前正在处理的数组元素
- index 表示当前正在处理的数组元素的索引
- arr 表示原数组
- init 初始值
以下是两段示例代码——
//将user中所有对象的age求和
let sum =user.reduce(zonghe,0)//0为初始值,应根据实际需求填写初始值
function zonghe(pre,current){
return pre+current.age
}
//也可以将方法囊括进reduce内
let sum =user.reduce((pre,current)=>{
return pre+current.age
},0)//pre为上一次返回的值,current为当前对象
console.log(sum)
let all = user.reduce(tongji,{})//最终的all为一个对象,因此初始值设置为空对象
function tongji(pre,current){
if(current.name in pre){//判断目前的对象的名字是否在之前出现过(pre对象是否有该名字命名的属性名)
pre[current.name]++//若有则令该属性的值自增1
}else{
pre[current.name]=1//若无则新增该属性,值为1
}
return pre//返回由user所有对象的名字为属性组成的对象
}
JSON
一个标准的json数据格式属性名一定是字符串(用双引号“”包裹)
- 标准的 JSON
- json 对象 {}
- json 数组 []
- JSON可以嵌套数组和对象
- 一个json 数据例子: ["无论是数组还是对象都可以嵌套",1,{"name": "张三", "age": 23, "man": true, "children": [ { "name": "张大宝", "age": 2 },{ "name": "张小宝", "age":1 } ],"wife":{"name":"李四","age":22}}]
其他
- reverse颠倒数组前后顺序(倒着写一遍,会改变原数组)
- if (a in b)——a为字符串,b为对象,如果字符串a是对象b的其中一项属性名,则返回true
小知识
- ==不比较类型只比较值,===比较类型
- 可以使用debugger调试程序
- console.log(a,b)两个对象之间用','分隔而不是'+'
本节参考资料——