20200831–叶梦宇-
学习总结
数组
arr[i]
三个不限制
不限制元素的数据类型
不限制下标越界
取值超过下标，不报错，返回undefined
赋值超过下标，不报错，自动在指定位置创建新元素
稀疏数组：下标不连续的数组，此时数组会自动将length调整到最大下标+1
不限制元素个数
var arr=new Array(3);
arr[0]="name";
arr[1]="sex";
arr[2]="age";
arr[6]="birthday";
数组长度
数组名.length
获取最后一个元素 arr[arr.length-1]
获取倒数第n个元素 arr[arr.length-n]
末尾追加一个新元素 arr[arr.length]=值
缩容
删除末尾一个元素 arr.length--
删除末尾n个元素 arr.length-=n
清空数组 arr.length=0
数组分类
索引数组
索引数组以0开始的整数作为下标
遍历索引数组
for(var i=0;i<arr.length;i++){
arr[i]; //当前数组元素
}
关联数组
关联数组使用字符串作为下标，关联数组中的元素只能单独添加
创建关联数组 var hash=[name："哈哈哈"，age=“123”]
访问关联数组元素 hash["下标名(key)"]
关联数组特点
关联数组length属性始终为0
关联数组无法使用索引数组的API
关联数组遍历
for(var key in hash){
key //仅获取当前下标名称
hash[key] //获取当前元素值
}
常用方法：仅获取hash中的所有key
var keys=[];
var i=0;
for(keys[i++] in hash);
遍历数组中的元素
for-in
for(var key in 数组){
// key是要遍历的每个元素的下标
// 数组[key]是每个下标对应的元素
}
for循环
for(var i=0;i<数组.length;i++){
// i表示每个元素的下标
// 数组[i]表示下标对应的元素
}
数组中的方法
数组转字符串
String(arr)
arr.toString()
arr.join("连接符")
var arr=[1,2,3,4];
arr.join("/")
无缝拼接 arr.join("")
判断空数组 arr.join("")===""
动态生成页面元素
var arr=["h","e","l","l","o"]
var html=""+arr.join("")+""
document.body.innerHTML=html
拼接和截取数组
拼接和截取都无权修改原数组，只能返回新数组，必须用变量承接返回值
拼接
var newArr=arr1.concat(arr2,....)
截取
var subArr=arr.slice(start,end);
注意：截取时包含start，不包含end。如果end为负数，是从start位置 到倒数第end位
修改数组
删除元素
arr.splice(start,n) start表示从第几个下标开始 ，n表示删除长度。
注意：start为负数，表示倒数从第几个参数开始删除。
var arr=[1,2,3,4,5,6,7,8,9];
// 只有一个负数代表删除倒数n个数
arr.splice(-2)
console.log(arr)
省略第二个参数，表示删除starti位置后所有元素
返回值
var deletes=arr.splice(starti,n)
插入元素
arr.splice(start,0,值1,值2,...) ，原start位置的值及其之后的值被向后顺移
替换元素
arr.splice(start,n,值1,值2...) 先删除arr中start位置的n个元素，再在start位置插入新元素
常用方法：广告轮播
移除开头的n个元素拼到结尾
imgs=imgs.concat(imgs.splice(0,n))
移除结尾的n个元素拼到开头
imgs=imgs.splice(-n).concat(imgs)
翻转数组中的元素
arr.reverse()
var arr=[1,2,3,4,5,6,7,8,9];
console.log(arr.reverse())
排序
解决问题：自定义比较器函数
定义比较器函数
升序
function compare(a,b){return a-b;}
降序
function compare(a,b){return b-a;}
将比较器函数作为对象传入sort方法
arr.sort(compare)
es6写法 arr.sort((a,b)=>a-b)
栈和队列
JS中没有专门的栈和队列的类型，都是用普通数组模拟的
栈：一端封闭只能从另一端进出的数组
注意：开头入栈和结尾入栈的顺序是相反的
(结尾)出入栈
入
arr.push(值)
在数组的末尾添加元素，返回数组的长度
查看数组最后一位的值：arr[arr.length]=值
出
删除数组的最后一个元素
var last=arr.pop()
(开头)出入栈
入
在数组的开头添加元素，返回数组的长度，相当于arr.splice(0,0,值)
arr.unshift(值)
出
删除数组的第一个元素
arr.shift()
队列(queue)： 只能从结尾进入，从开头出的数组
结尾入
在数组的末尾添加元素，返回数组的长度
查看数组最后一位的值：arr[arr.length]=值
arr.push(值)
开头出
删除数组的第一个元素
arr.shift()
二维数组
数组中的元素内容，又是一个子数组，数组中每个元素也是数组
创建二维数组
var arr=[];
arr[i]=[值1,值2,...]
在创建数组同时，初始化子数组
var arr=[
[值1,值2,...],
[值1,值2,...],
]
访问二维数组中的元素
arr[i][j】 提示：用法和普通数组元素的用法完全一样
注意：任何情况一维下标 i 不能越界，否则直接报错
遍历二维数组
for(var i=0;i<arr.length;i++){
for(var j=0;j<arr[i].length;j++){
arr[i][j】 //当前元素
}
}
字符串
字符串是由多个字符组成的只读字符数组，用于存储和处理文本
字符串 对比 数组
相同点
1. 字符串和数组都有下标
2. 字符串和数组都有“.length”的方法
-
字符串和数组都可以使用for循环遍历
-
字符串和数组都有slice()的方法
不同点
1.字符串和数组两者类型不同
2.字符串和数组的API不通用
string API
将任意的类型转为字符串
new String() 转为字符串，返回对象
String() 转为字符串，返回字符串
大小写转换
将英文字母转为大写 str.toUpperCase()
将英文字母转为小写 str.toLowerCase()
获取指定位置字符 var char=str.charAt(i)
获得指定的unicode码 var unicode=str.charCodeAt(i)
将unicode码转换为字符 var char=String.fromCharCode(unicode)
查找某个字符出现的位置下标
var i=str.indexOf("字符",start)
在str中从start位置开始查找下一个关键词的位置，若省略start，则默认为0
优点：可以指定开始位置，可以找所有
缺点：不支持正则，一次只能找一种字符
查找所有字符出现的位置
var i=-1;
while((i=str.indexOf("字符",i+1))!=-1){
console.log(i) //本次找到的字符位置下标
}
专门查找最后一个字符的位置
var i=str.lastIndexOf("字符")
截取字符串
1. var subStr=str.slice(start,end)
-
var subStr=str.substring(start,end)
slice 和 substring 对比-
slice下标允许使用负数，substring下标为负数自动转为0
-
slice中开始的下标小于结束的下标，substring下标不分顺序
var subStr=str.substr(start,n) n为 截取 长度
-
DOM
DOM (Document Object Model) 译为文档对象模型，是 HTML 和 XML 文档的编程接口。
HTML DOM 定义了访问和操作 HTML 文档的标准方法。
DOM 以树结构表达 HTML 文档。
DOM操作流程
1，在头脑中构建DOM树
2，查找我们要触发事件的 元素。
3，为元素绑定事件
4，查找发生事件的元素
换行是个节点，空格也是个节点，table也是个结点
学习心得
自己努力学吧
近期评论