打卡day 9

最新推荐文章于 2022-10-27 20:50:17 发布

怎么能不笑呢

最新推荐文章于 2022-10-27 20:50:17 发布

阅读量65

点赞数

文章标签： javascript 前端开发语言

本文链接：https://blog.csdn.net/a1939249353/article/details/126532695

版权

数组操作方法 e5

1.forEach(item,index,origin) 遍历数组

=> item: 表示数组的每一项

=> index: 表示数组每一项的索引

=> origin: 表示原始数组

下面也一样 item index origin

   var num=[2,6,5,7,3,4,8,9];
   num.forEach(function(item,index,origin){
        //item index origin 是自定义的 也可以是 abc  也可只写一个或两个
            document.write(item,'&emsp;',index,'&emsp;',origin,'<br/>' )
    });
    document.write('<br/>')

练习


//求每一项的和
    var sum=0;
    num.forEach(function(a){

  sum+=a

    })
    document.write(sum);
    document.write('<br/>')

//求最大数值所在的索引
var max=0;
num.forEach(function(a,b){
if(a>num[max]){
    max=b;//如果有值比max大  就把那个值的索引给max
}
})
document.write(max);
document.write('<br/>')

var num1=[2,666,56,78,3,44,23,56,78];

2.map()

+ 语法: 数组.map( function (item, index, origin) {} )

+ 作用: 映射数组

+ 返回值: 和原始数组长度一样的数组, 只不过内部数据经过映射加工 + 注意: 映射条件以 return 的形式书写需要返回值

每个数据执行相同的方法

// 求数列的每项都加100后的数列
var se=num1.map(function(a,b){
    return a+100;// 返回值是 a+100
})
document.write(se);
document.write('<br/>')

3.filter()

+ 语法: 数组.filter( function (item, index, origin) {} )

+ 作用: 过滤数组

+ 返回值: 必然是一个新数组, 内部存储的是原始数组内过滤出来的部分数据

+ 注意: 过滤条件以 return 的形式书写、

筛选数列

//筛选出数组中比5大的数
var num2=[2,6,5,7,3,4,8,9];

var ss=num2.filter(function(a){
    return a>5;
})
document.write(ss);
document.write('<br/>');

4.find()

+ 语法: 数组.find( function (item, index, origin) {} )

+ 作用: 在原始数组内查找满足条件的第一项

+ 返回值: 找到的数据

+ 注意: 查找条件以 return 的形式书写


// 寻找 num3 里面name=2 的score值
var num3=[{'name':1,'score':80},{'name':2,'score':60},{'name':3,'score':50}];
 
var st=num3.find(function(a){
 return  a.name==2; //a 就是item  可以自定义  意思是 数组的每一项  a.name  寻找每一项找到 name=2 的项
})
document.write(st.score);
document.write('<br/>');

5.findIndex()

+ 语法: 数组.findIndex( function (item, index, origin) {} )

+ 作用: 在原始数组内查找满足条件的第一项的索引

+ 返回值: 找到的数据的索引

+ 注意: 查找条件以 return 的形式书写

//寻找数组中 name=1 的第一个数的索引  
var num4=[{'name':1,'score':80},{'name':2,'score':60},{'name':3,'score':50},{'name':1,'score':85}];
 
var se=num4.findIndex(function(item){
    return  item.name==1;
})
document.write(se);
document.write('<br/>');

6.every()

+ 语法: 数组.every( function (item, index, origin) {} )

+ 作用: 判断数组内是否每一个都满足条件

+ 返回值: 一个布尔值

=> true, 说明数组内每一个数据都满足条件

=> false, 说明数组内至少有一个是不满足条件的

+ 注意: 判断条件以 return 的形式书写

//  判断是否数组里的score 都>50  是 返回 true  不是返回false
var num4=[{'name':1,'score':80},{'name':2,'score':60},{'name':3,'score':50}];
var sb=num4.every(function(item){
    return item.score>50;
})
document.write(sb);
document.write('<br/>');

7.some()

与every 是 && ||的关系

some 有一个满足条件就返回true

+ 语法: 数组.some( function (item, index, origin) {} )

+ 作用: 判断数组内是否有某一个满足条件

+ 返回值: 一个布尔值

=> true, 说明数组内至少有某一个是满足条件的

=> false, 说明数组内所有的项都不满足条件

     + 注意: 判断条件以 return 的形式书写

8.reduce()

+ 语法: 数组.reduce(function (prev, item, index, origin) {}, init)

=> prev: 表示初始值或者上一次的运算结果

=> item: 表示数组的每一项

=> index: 表示数组每一项的索引

=> origin: 表示原始数组

+ 作用: 用来实现叠加效果累加

+ 返回值: 最终叠加结果

+ 注意: 叠加条件以 return 的形式书写

+ 注意: prev 的值, 如果你传递了 init, 就是 init 的值, 如果你没有传递 init, 那么就是数组 [0] 的值

+ 注意: 如果你传递了 init, 循环执行 length 次, 如果你没有传递 init, 循环执行 length - 1 次, 少的是第一次

//求数组的和
var num6=[1,2,3];
var sa=num6.reduce(function(prev,item){
    return prev+item;//每一项相加  0+1  1+2   3+4 ...
})
document.write(sa)

数组的去重

  var arr = [1, 2, 3, 2, 3, 1, 4, 2, 5, 6, 4, 7, 8, 3, 5, 6, 7, 9, 2, 1];


        //先排序 
        //判断前后两个是否一样 一样就删除一个
       arr.sort(function(a,b){if(a>b){ return 1} return -1})
         //alert(arr)
       for(var i=0;i<arr.length;i++){
           if(arr[i] == arr[i+1]){
            arr.splice(i,1);
               i--;
            }

         }
        alert(arr)


        // 遍历  查看后边是否有一样的 
        // for(var i=0;i<arr.length;i++){
           // 从当前位置 往后 查找
            // i
            // i+1
            var index = arr.indexOf(arr[i],i+1);
           if(index != -1){
                 arr.splice(index,1)
                i--;
             }
         }
        alert(arr)


        //无序集合数据结构
        // 这个数据结构 本身就要求 每个数据都是唯一的 

        数组->无序集合-> 数组

        var test = new Set(arr);
        document.write(test) // [object set] 这是一个集合类型

        转回数组 
        var res = Array.from(test)
        document.write(res)
        document.write(arr) // 原数组不变

         document.write([...test])


        // 创建集合  new Set() 
        // 数组转集合 new Set(数组)
        // 集合转数组  Array.from(集合)
        // 集合转数组 [...集合] 三个.不能少

        function unique_arr(arr) {
            var res = [];
            for (var i = 0; i < arr.length; i++) {
                if (res.indexOf(arr[i]) == -1) {
                    res.push(arr[i])
                }
            }
            return res;
        }


        alert(unique_arr(arr))

选择排序

    var num = [2, 6, 8, 4, 5, 1, 3];
      for(var j=0;j<nums.length-1;j++){
            // 假设j下标所在的位置数字最小
            var minIndex = j;
            for(var i=j+1;i<nums.length;i++){
                if(nums[i] < nums[minIndex]){
                        minIndex = i;
                }
            }
            var tmp = nums[j];
            nums[j] = nums[minIndex];
            nums[minIndex] = tmp;
        }

        console.log('选择排序之后的:',nums)

严格模式

‘use strict’

按照规定来不合规矩就报错

字符串

字符串的创建

字面量方式创建

 var test = []
      var test1 = {}
        var str1 = 'hello world';  
        var str2 = "hello world"; 
      var str3 = `hello world`; 
        console.log(str1)
      console.log(str2)
       console.log(str3)

使用内置工具来创建

  var a1 = new Array()
     var o1 = new Object()

字符串属性和方法

        // 基本包装类型 

    // 原本只有对象才可以 调用自己的静态属性和动态方法  

    // 但是系统给予了跟对象一样的权限  可以使用属性和方法

长度属性 length 注：空格也算长度有多少个字符

索引属性

//遍历字符
for(var i=0;i<=s1.length;i++){
     alert(s1[i])
     }

字符串不支持修改


    var test = [1,2,3,4,5];

    test[3] = 400;
    alert(test);

    s1[1] = 'z';  
     alert(s1);
   //  基本类型的数据永不改变   'hello world' 如果拼接 返回也只是新的字符串

字符串常用方法

    + 通用语法: 字符串.方法名()

    + 注意: 所有的字符串常用方法都会不改变原始字符串, 而是以返回值形式给出结果

    //如果结果是字符串  也是一个新的字符串 



  1. charAt()

    + 语法: 字符串.charAt(索引)

    + 返回值: 该索引位置的字符

      => 如果没有该索引位置, 返回的是 空字符串



  2. charCodeAt()

    + 语法: 字符串.charCodeAt(索引)

    + 返回值: 该索引位置字符的 unicode 编码

      => 如果没有该索引位置, 返回的是 NaN



  3. toUpperCase()

    + 语法: 字符串.toUpperCase()

    + 返回值: 将原始字符串内的所有字母转换成大写



  4. toLowerCase()

    + 语法: 字符串.toLowerCase()

    + 返回值: 将原始字符串内的所有字母转换成小写



  5. substr()

    + 语法: 字符串.substr(开始索引, 多少个)

    + 返回值: 截取出来的部分字符串



  6. substring()

    + 语法: 字符串.substring(开始索引, 结束索引)

    + 特点: 包前不包后

    + 返回值: 截取出来的部分字符串



  7. slice()

    + 语法: 字符串.slice(开始索引, 结束索引)

    + 特点: 包前不包后, 填写负整数

    + 返回值: 截取出来的部分字符串



  8. split()

    + 语法: 字符串.split('分隔符')

    + 返回值: 是一个数组

      => 按照分隔符把字符串分开成为几段内容



  9. concat()

    + 语法: 字符串.concat(字符串1, 字符串2, ...)

    + 返回值: 拼接好的字符串



  10. indexOf()

    + 语法: 字符串.indexOf(查找的字符, 开始索引)

    + 返回值:

      => 如果原始字符串内有该字符串片段, 那么是该字符串片段第一次出现的首字母索引位置

      => 如果原始字符串内没有该字符串片段, 那么是 -1



  11. lastIndexOf()

    + 语法: 字符串.lastIndexOf(字符串片段, 开始索引)

    + 返回值:

      => 如果原始字符串内有该字符串片段, 那么是该字符串片段第一次出现的首字母索引位置

      => 如果原始字符串内没有该字符串片段, 那么是 -1



  12. includes()

    + 语法: 字符串.includes(字符串片段)

    + 作用: 该字符串中是否包含该字符串片段

    + 返回值: 一个布尔值

      => true 说明有该字符串片段

      => false 说明没有该字符串片段



  13. startsWith()

    + 语法: 字符串.startsWith(字符串片段)

    + 作用: 判断该字符串是否以该字符串片段开头

    + 返回值: 一个布尔值

      => true 说明以该字符串片段开头

      => false 说明不以该字符串片段开头



  14. endsWith()

    + 语法: 字符串.endsWith(字符串片段)

    + 作用: 判断该字符串是否以该字符串片段结尾

    + 返回值: 一个布尔值

      => true 说明以该字符串片段结尾

      => false 说明不以该字符串片段结尾



  15. trim()

    + 语法: 字符串.trim()

    + 作用: 去除字符串首尾空白

    + 返回值: 去除首尾空白后的字符串



  16. trimStart() / trimLeft()

    + 语法:

      => 字符串.trimStart()

      => 字符串.trimLeft()

    + 返回值: 去除开始位置空白以后的字符串



  17. trimEnd() / trimRight()

    + 语法:

      => 字符串.trimEnd()

      => 字符串.trimRight()

    + 返回值: 去除结束位置空白以后的字符串



  18. repalce()

    + 语法: 字符串.replace(换下字符, 换上字符)

    + 作用: 替换原始字符串内的片段

    + 注意: 只能替换一个

    + 返回值: 替换好的字符串


  15. trim()

    + 语法: 字符串.trim()

    + 作用: 去除字符串首尾空白

    + 返回值: 去除首尾空白后的字符串



  16. trimStart() / trimLeft()

    + 语法:

      => 字符串.trimStart()

      => 字符串.trimLeft()

    + 返回值: 去除开始位置空白以后的字符串



  17. trimEnd() / trimRight()

    + 语法:

      => 字符串.trimEnd()

      => 字符串.trimRight()

    + 返回值: 去除结束位置空白以后的字符串



  18. repalce()

    + 语法: 字符串.replace(换下字符, 换上字符)

    + 作用: 替换原始字符串内的片段

    + 注意: 只能替换一个

    + 返回值: 替换好的字符串