知识点回顾：
首先，让我们来回顾一下之前关于函数的知识吧~
1.函数的性质：封装性，复用性，调用性
2.函数名命名 ：小驼峰（首字母不要大写）
3.形参：是指函数声明是的参数；用于接受实参的；本质上是局部变量
4.实参：函数调用时的参数；
5.返回值 return 作用 ：返回一个结果；结束整个函数
6.函数的预编译：函数可以先调用后声明
7.arguments 用于接受实参列表（伪数组）
8. 递归函数：自己调用自己
9. 构造函数 ：创建对象
数组：
1.数组的2种创建方式
- [ ]
- new Array(1,2,3,3)
2.封装：在JavaScript中，以下函数都封装好了，可以直接调用。但是我们仍然需要掌握这些函数封装的原理。
includes()：
判断数组中是否存在某个值（假设法，假设存在）
includes的原生封装。
//includes() :判断数组中是否存在某个值
function includes(arr , a){
//循环遍历数组
for(var i = 0 ; i < arr.length ; i++){
//如果存在，结束整个函数，返回true
if(arr[i] == a){
return true ;
}
}
return false ;
}
var res = includes([1,2,3,4,5] , 4) ;
console.log(res) ;
includes()用法：
var arr = [1,2,3,4,2,5] ;
console.log(arr.includes(20)); //false
console.log(arr.includes(1)); //true
indexOf():
判断数组中是否存在某个值，存在返回第一次出现的下标,不存在就返回-1
indexOf()的原生封装。
function indexOf(arr,n){
//循环整个数组
for(var i = 0 ; i < arr.length ; i++){
if(arr[i] == n) {
return i ;
}
}
return -1 ;
}
var res = indexOf([1,2,3,4,5] , 4) ;
console.log(res) ; // 3
indexOf()用法：第一次出现的下标,找不到就返回-1
var arr = [1,2,3,4,2,5] ;
console.log(arr.indexOf(2)); // 1
console.log(arr.indexOf(8)); // -1
lastIndexOf()：
判断数组中是否存在某个值，存在返回最后一次出现的下标，不存在返回 -1
function lastIndexOf(arr , n){
for(var i = arr.length - 1 ; i >= 0 ; i--){
if(arr[i] == n){
return i ;
}
}
return -1 ;
}
var res = lastIndexOf([1,2,3,4,5,2] , 2) ;
console.log(res) ; // 5
lastIndexOf()用法：
var arr = [1,2,3,4,2,5] ;
console.log(arr.lastIndexOf(2)); // 4
console.log(arr.lastIndexOf(8)); // -1
join()：
把数组变成字符串
1.有关join()的封装
function join(arr){
res = '' ;
for(var i = 0 ; i < arr.length ; i++){
i < arr.length - 1 ? res += arr[i] + ',' : res += arr[i] ;
}
return res ;
}
var res = join([1,2,3,4]) ;
console.log(res) ; // 1, 2, 3, 4
2.join()的用法
var arr = [1,2,3,4] ;
console.log(arr.join('&')) ; //1&2&3&4
console.log(arr.join('')) ; //1234
push()：
通过遍历可以向数组尾部追加无数个数
var arr = [1, 2, 3];
console.log(arr.push('hello'));
arguments：把数组的长度变长 arr[arr.length] = arguments[i]
pop()：删除数组中最后一个值 ,创建一个新的数组 .遍历原数组时丢掉最后一个 i < arr.length - 1
concat()：
拼接数组，返回一个新的数组
concat()的原生封装：
function concat(){
var newArr = [] ;
for(var i in arguments){
var arr = arguments[i] ;
for(var j in arr){
newArr.push(arr[j]) ;
}
}
return newArr ;
}
var res = concat([1,2,3] , ['a','b','c']) ;
console.log(res) ;
concat()的用法
var arr1 = [1,2,3,4] ;
var arr2 = [6,7,8] ;
var arr3 = arr1.concat(arr2) ;
console.log(arr3) ;
slice(i,i)：
截取数组中的部分值,返回一个新的数组，截取数组中的值 (包前不包后)
var arr = [1,2,3,4,5,6,7] ;
var arr1 = arr.slice(2 , 3) ;
console.log(arr1) ; //3
splice
splice(i , 删除的个数 ， 新增的值…) 新增，删除，替换 — 直接改变原数组
用法1：在任意位置插入数据
arr.splice(i , 0 , v1 ,v2 , v3 ....)用法2：删除
arr.splice(i , 删除的个数)用法3：替换
var arr = [1,2,3,4,5,6] ;
//插入数据
arr.splice(2 , 0 ,'a' , 'b') ;
console.log(arr) ; //[1, 'b', 3, 4, 5, 6]
//删除
arr.splice(1 , 2) ;
console.log(arr) ; //[1, 'b', 3, 4, 5, 6]
//替换
arr.splice(1 , 1 ,'hello') ;
console.log(arr) ; //[1, 'hello', 3, 4, 5, 6]
判断数组
- 基本数据类型：number string boolean null undefined
- 基本数据类型可以通过 typeof 来判断
- 引用数据类型：function 数组 对象
- 用 Array.isArray() 判断是不是数组
var arr = [1, 2, 3] ;
console.log(typeof arr) ; //object 不能判断
console.log(Array.isArray(arr)) ; //true 证明是数组
数组去重
数组去重的两种方法：
1.得到新的数组
var arr = [1,2,3,42,1,3,2,2,1,3,5] ;
var newArr = [] ;
// 遍历原数组
for(var i in arr) {
// 判断原数组中每一个值是否在新数组中存在
// if(newArr.indexOf(arr[i]) === -1)
// if(!newArr.includes(arr[i])) {
// newArr.push(arr[i])
// }
// 自己把includes方法写了一遍
var flag = false ;
for(var j in newArr) {
if(newArr[j] === arr[i]) {
flag = true ;
break ;
}
}
if(!flag) {
newArr.push(arr[i])
}
}
console.log(newArr); //[1, 2, 3, 42, 5]
2.直接改变原数组。原理是出现重复的就删掉
// 拿第一个值出来跟后面所有的值作比较
var arr = [1,2,3,42,1,3,2,2,1,3,5] ;
// 比较的轮数
for(var i = 0 ; i < arr.length - 1 ; i++) {
// 拿第i个数与后面所有的数进行比较
for(var j = i + 1 ; j < arr.length ; j++) {
// 只要相同就删除
if(arr[i] === arr[j]) {
// 没删除一个的时候，数组塌陷!!!!!!!!!!
arr.splice(j , 1);
j--;
}
}
}
console.log(arr); //[1, 2, 3, 42, 5]
统计数组中每一个值出现的次数
方法一：统计每一个值出现的次数
function sta(arr){
//比较的轮数
for(var i = 0 ; i < arr.length ; i++){
var count = 0 ;
//拿每一个值与所有的值比较
for(var j = 0 ; j < arr.length ; j++){
if(arr[i] === arr[j]){
count++ ;
}
}
console.log(arr[i] + '出现了' + count + '次');
}
return count ;
}
sta([1,2,3,42,1,3,2,2,1,3,5]) ;
方法二：先去除重复再统计
// 方法1：先去重再统计
var arr = [1,2,3,42,1,3,2,2,1,3,5] ;
var arr2 = [] ;
for(var i = 0 ; i < arr.length ; i++) {
if(!arr2.includes(arr[i])) {
arr2.push(arr[i])
}
}
console.log(arr2);
// 拿新数组中的每一个值与原数组进行比较
for(var i = 0 ; i < arr2.length ; i++) {
var count = 0 ;
for(var j = 0 ; j < arr.length ; j++) {
if(arr2[i] === arr[j]) {
count++
}
}
console.log(arr2[i] + '出现了' + count + '次');
}
方法三：一边删除一边统计
for(var i = 0 ; i < arr.length ; i++) {
// 拿第一个值与后面的值进行比较
var count = 1 ;
for(var j = i + 1 ; j < arr.length ; j++) {
if(arr[i] === arr[j]) {
count++ ;
arr.splice(j , 1) ;
j-- ;
}
}
console.log(arr[i] + '出现了' + count + '次');
}
console.log(arr);
方法四：先排序，再统计
//假设数组已经排好序了
var arr = [1,1,1,1,2,2,2,3,4,4];
for(var i = 0 ; i < arr.length ; ) {
var count = 1 ;
for(var j = i + 1 ; j < arr.length ; j++) {
if(arr[i] === arr[j]) {
count++ ;
}
else {
// 只要不相等说明后面没有相同 的了
break ;
}
}
console.log(arr[i] + '出现了' + count + '次');
i += count
}
sort 排序
sort() 方法用于对数组的元素进行排序,并返回数组。默认排序顺序是根据字符串ASCII码 ----- 升序
var arr = [3,5,2,6,1];
var res = arr.sort() ;
console.log(res); //[1, 2, 3, 5, 6]
使用 sort() 方法时，应该注意下面几个问题。
所谓的字母顺序，实际上是根据字母在字符编码表中的顺序进行排列的，每个字符在字符表中都有一个唯一的编号。
如果元素不是字符串，则 sort() 方法试图把数组元素都转换成字符串，以便进行比较。
sort() 方法将根据元素值进行逐位比较，而不是根据字符串的个数进行排序。
var arr = [3,5,21,6,1];
var res = arr.sort() ;
console.log(res); //[1, 21, 3, 5, 6]
注意：sort() 方法是在原数组基础上进行排序操作的，不会创建新的数组。
*如果想按照其他规则进行排序，就需要提供比较函数，该函数要比较两个值，然后返回一个用于说明这两个值的相对顺序的数字。比较函数应该具有两个参数 a 和 b，其返回值如下：
- 若 a 小于 b，在排序后的数组中 a 应该出现在 b 之前，则返回一个小于 0 的值。
- 若 a 等于b，则返回 0。
- 若 a 大于 b，则返回一个大于 0 的值。
也就是说：比较函数两个参数a和b，返回a-b 升序，返回b-a 降序
sort(function(a,b){return a - b}) 升序
sort(function(a,b){return b - a}) 降序
var arr = [3,5,21,6,1];
var res = arr.sort(function (a , b) {
//降序排列
return a - b
})
console.log(res); //[1, 3, 5, 6, 21]
callback:回调函数
含义：被当作参数使用的函数叫回调函数
function xunHuan(n , fn){
for(var i = 0 ; i < n ; i++){
fn()
}
}
xunHuan(5 , function(){
document.write(1 + '<br>') ;
})
输出结果：
数组的迭代方法：
1.sort() ASCII升序（上文已经讲解，不再过多赘述，举个简单的例子吧~
var arr = [5,3,22,1,7] ;
var res = arr.sort(function (a , b){
//降序排列
return b - a ;
})
console.log(res) ; //[22, 7, 5, 3, 1]
2.forEach(function(v , i , arr){}) ：遍历数组，其中 v 表示值，i 表示角标 ,arr表述数组。
3.map(function(v,i,arr){}) ：改变数组中的值，返回一个新的数组 必须return
4.filter(function(v,i,arr){}) ： 过滤器，找到满足条件的值，返回一个新的数组
5.every(function(v,i){}) ：判断数组中是不是每一个值都满足条件
6.some(function(v,i){}) ：判断数组中有没有满足条件的值
训练：利用遍历数组的方法求和
var arr = [1,2,3,4,5,6,7] ;
var sum = 0 ;
//遍历数组
arr.forEach(function (v , i , arr){
//累加求和
sum += v ;
})
console.log(sum) ; //8
function forEach(arr , cb){
for(var i = 0 ; i < arr.length ; i++){
cb(arr[i] , i)
}
}
forEach([1,2,3] , function(v , i){
console.log(v) ; // 1 2 3 值
console.log(i) ; // 0 1 2 角标
})
训练：把数组中的每个值加1
var arr = [1 , 2 , 3] ;
function countArr(arr , cb){
for(var i = 0 ; i < arr.length ; i++){
arr[i] += cb(arr[i])
}
console.log(arr) ;
}
countArr([2,3,4] , function(v){
return v * 3 ;
})
最后：总结一个return的知识，return只对当前的 if 和函数管用。对上一层的循环是没用的。请看下面的例子
此时：return 不起作用，也没有任何意义。还是会输出数组的值
var arr = [5,3,22,1,7] ;
//遍历数组
arr.forEach(function(v , i){
//控制台打印数组的值
console.log(v); // 5 3 22 1 7
if(i == 2){
// break ; // 报错
return ; //没有任何意义 还是会输出5 3 22 1 7
}
})
15万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
