JavaScript【4】数组和其他内置对象(API)

发布于:2025-05-18 ⋅ 阅读:(20) ⋅ 点赞:(0)

1.数组:

1.概述:

  •    js中数组可理解为一个存储数据的容器,但与java中的数组不太一样;
    
  •    js中的数组更像java中的集合,因为此集合在创建的时候,不需要定义数组长度,它可以实现动态扩容;
    
  •    js中的数组存储元素时,可以存储任意类型的元素,而java中的数组一旦创建后,就只能存储定义类型的元素;
    

2.数组的创建:

1.方式1:通过new关键字创建(不常用);

 let arr = new Array();
   arr[0]=元素1;
   arr[1]=元素2;
   ........

2.方式2:通过字面量直接创建:

let arr=[元素1,元素2,.....]
let arr = ['这是数组的元素', 1, true, {name: '张三'}, null];
//Array.isArray(arr):判断是否为数组,如果通过typeof操作符来验证,数组会返回Object
console.log(Array.isArray(arr),arr);

3.数组的操作方法:

1.遍历数组:

方式1:for循环:
let arr = ['这是数组的元素', 1, true, {name: '张三'}, null];
for (let i = 0; i < arr.length; i++) {
        console.log(arr[i])
    }

方式2:foreach循环(IE8以下的浏览器可能不支持)
let arr = ['这是数组的元素', 1, true, {name: '张三'}, null];
//value 元素, index下标, array数组本身
   arr.forEach(function (value, index, array) {
          console.log(value, index)

      })
            ![](https://cdn.nlark.com/yuque/0/2024/png/45532635/1731668979439-27e8c586-0ba8-4a27-bf8d-a9757ffda30e.png)

2.追加元素:

1.数组末尾追加元素:push()
 let arr = ['这是数组的元素', 1, true, {name: '张三'}, null]; 
    arr.push('追加数据1', '追加数据2');
     console.log(arr);
   

2.数组头部添加元素:unshift()
  let arr = ['这是数组的元素', 1, true, {name: '张三'}, null]; 
    arr.unshift('追加数据1', '追加数据2');
     console.log(arr);
   

3.删除元素:

1.删除末尾元素:pop()
  let arr = ['这是数组的元素', 1, true, {name: '张三'}, null]; 
    arr.pop();
     console.log(arr);
      

2.删除首位元素:shift()
  let arr = ['这是数组的元素', 1, true, {name: '张三'}, null]; 
    arr.shift('追加数据1', '追加数据2');
     console.log(arr);
   

4.数组反转:会改变原数组:reverse()

let arr = [1,2,3,4,5,6,7,8,9];
  arr.reverse();
   console.log(arr)

5.数组排序:默认按照Unicode编码排序:sort()

let arr = [5, 68, 8, 6, 3, 2, 4, 5, 6, 8, 7, 1, 32, 3];
arr.sort();
console.log(arr);

如果需要按照自定义的排序规则进行排序,就需要重写这个方法

let arr = [5, 68, 8, 6, 3, 2, 4, 5, 6, 8, 7, 1, 32, 3];
arr.sort(function (a, b) {
         //a - b; 小到大
         //b - a; 大到小
         return a - b;
     })
console.log(arr);

6.向数组中 添加 后者删除 或者 替换元素:splice()

 let arr = ['a', 'b', 'c', 1, 2, 3];
     //index: 下标 必须 添加、删除元素的位置 可以使用负数 -1倒数第一个元素...
     //howmany: 数目 必须  要删除的元素的数量   如果设置为0 则不删除
     // ...item 可选 向数组中添加的元素
     console.log(arr.splice(2,1,'add1','add2'));
     console.log(arr);  

上述代码表示从数组中下标为2的位置删除一个元素,并添加两个新元素,再将删除的元素返回

7.合并数组:

方式1:concat
     let arr = [1, 2, 3];
     let arr2 = ['a', 'b', 'c'];
     let arr3 = ['A', 'B', 'C'];
    //将三个数组合并
     let res = arr.concat(arr2,arr3,'插入元素','插入元素')
     console.log(res);

方式2:数组展开语法(ES6特有)
     let arr = [1, 2, 3];
     let arr2 = ['a', 'b', 'c'];
     let arr3 = ['A', 'B', 'C'];
       console.log([...arr,...arr2,...arr3])
       console.log( arr);

8.数组元素拼接为字符串:

方式1:toString
  let arr = [1, 2, 3,'a','b','c']; 
  console.log(arr.toString())

方式2:join方法:
    let arr = [1, 2, 3,'a','b','c']; 
  console.log(arr.join("-"));

9.字符串拆分成数组:split()

let str='1-2-3-a-b-c';
console.log(str.split('-'));

10.裁切数组的元素:slice()

 let arr = ['a', 'b', 'c','d'];
     let result = arr.slice(1,3);
     console.log(result)
     console.log(...arr)

11.数组元素下标查询:indexof()/lastindexof()

let arr=[1,2,3,4,6,2,5];
//indexof查找首次出现的元素下标,查不到返回-1
console.log(arr.indexof(2));

        let arr=[1,2,3,4,6,2,5];
      //lastindexof查找最后一次出现的元素下标,查不到返回-1
      console.log(arr.lastIndexOf(2));

12.数组遍历,并对获取到的每一个数据进行操作:map()

let arr = [5, 68, 8, 6, 3, 2, 4, 5, 6, 8, 7, 1, 32, 3];
     // 遍历数组 每次循环时执行调用函数,根据回调函数的返回值
     //生成新的数组并返回
     let res = arr.map(function (item, index, array) {
         return item  * 2;
     })
     console.log(res)
     console.log(arr)

13.数组元素过滤:fliter()

 // 遍历数组 把满足条件的数据筛选出来 方法新的数组中
    let list = [2, 4, 58, 45, 4, 57, 8, 12, 475, 43, 1, 24, 54, 56]
    // item 元素 , index 下标, array 数组本身
    let res = list.filter(function (item, index, array) {
        return item >= 50;
    })
    console.log(res)

14.数组元素判断:

1.判断所有元素是否都满足特定条件:every()
 let list = [2, 4, 58, 45, 4, 57, 8, 12, 475, 43, 1, 24, 54, 56];
    //判断数组中所有的元素是否满足一个条件
     let result = list.every(function (item, index) {
         return item >= 50;
     })
     console.log(result)  

2.判断任意元素是否满足特定条件:some()
 let list = [2, 4, 58, 45, 4, 57, 8, 12, 475, 43, 1, 24, 54, 56];
    //判断数组中所有的元素是否满足一个条件
     let result = list.some(function (item, index) {
         return item >= 50;
     })
     console.log(result)  

3.判断数组中是否存在目标元素:includes();
 let list = [2, 4, 58, 45, 4, 57, 8, 12, 475, 43, 1, 24, 54, 56];
//判断数组中是否包含一个指定的值  如果存在 true  不存在false
     console.log(list.includes(570))
  

15.数组元素累加和:reduce()/reduceRight()

  reduceRight表示从后往前累加:
     let list = [2, 4, 58, 45, 4, 57, 8, 12, 475, 43, 1, 24, 54, 56];
    /**
     * 求数组中所有的元素的累加和
     * sum = 0
     * prev:回调初始值 sum = 0
     *          可以设置初始化 如果没有设置初始值
     *           默认会将数组中的第一个元素 设置为初始值
     *
     * item:每次循环的元素
     * index:每次循环的下标
     * array:当前数组
     * initVal:初始值
     */
      let sum = list.reduce(function (prev, item, index, array) {
          console.log(prev, item, index, array)
          return prev + item;
      })
      console.log("和:",sum)

16.将对象转成数组:from()(不常用)

    let person = {
        0: '张三',
        1: '28',
        2: '男',
        length: 3
    }
    let list = Array.from(person);
    console.log(list)

说明:

  • 对象中必须有length属性,才可以进行转换;
    
  • 对象的属性名必须是数组下标,否则转换之后无法获取到数组元素
    

2.其他内置对象:

1.Date:时间相关:

   let date = new Date();
      console.log(date.getFullYear());
      console.log(date.getMonth()+1);
      console.log(date.getDate());
      console.log(date.getHours());
      console.log(date.getMinutes());
      console.log(date.getSeconds());
      console.log(date.getMilliseconds());

2.Math:数学相关:

    console.log(Math.PI)
    console.log(Math.abs(1));
    console.log(Math.floor(1.99)) //向下去整数
    console.log(Math.ceil(1.1))//向上去整数
    console.log(Math.round(1.5))//四舍五入
    
    // 产生 0-1 之间的随机数
     console.log(Math.ceil(Math.random() * 10)) 

相关函数汇总:

3.String:字符串:

1.获取长度:length();
 let str = "Hello,World!";
 console.log(str.length)
2.通过下标获取字符:charAt()
let str = "Hello,World!";
 console.log(str.charAt(0));
3.通过下标 获取 指定位置的字符的Unicode编码:charCodeAt();
let str = "Hello,World!";
console.log(str.charCodeAt(0));
4.字符串拼接:concat():
//参数是  string[]
console.log(str.concat('A','C','D')) 

5.查找目标字符的下标:indexof/lastindexof()
let str = "Hello,World!"; 
//返回第一个遇到的字符串的下标
console.log(str.indexOf("l"))
//返回最后一次遇到的字符下标
console.log(str.lastIndexOf("A"))
6.截取字符串:
1.slice():
    let str = "Hello,World!"; 
    //截取字符串  包前不包后
    //第一个参数 :开始的下标位置
    //第二个参数可以为负数(-1表示 倒数第一个值)  如果不传 截取到末尾
     console.log(str.slice(1,4))
     console.log("原:",str);  
2.substring():
       let str = "Hello,World!";  
     //第一个参数 :开始的下标位置
    //注意 :第一个参数 如果大于第二个参数则会交换位置
     console.log(str.substring(4,1))
    console.log("原:",str);
3.substr():注意此方法已过期
     let str = "Hello,World!";  
    //第一个参数 截取开始的下标
    //第二个参数 截取的长度
     console.log(str.substr(1,4))
     console.log("原:",str);
7.检查字符串中是否包含目标字符串:includes()
         let str = "Hello,World!";  
     //检查字符串中是否包含 "," 包含 true 不包含 false
     console.log(str.includes(","))
8.大小写转换:
1.转大写:toUpperCase():
 let str = "Hello,World!";  
 console.log(str.toUpperCase())
2.转小写:toLowercase():
 let str = "Hello,World!";
  console.log(str.toLowerCase())

3.正则表达式:

1.概述:

正则表达式指用于定义一些字符串的规则,可被用来检查一个字符串是否符合规则;

2.创建方式:

1.方式1:new

let reg  = new RegExp('正则表达式','匹配模式');
 匹配模式:
   i:忽略大小写
   g:全局匹配
   ig:忽略大小写,且全局匹配
    //创建正则表达式,判断字符串中是否存在‘ab’字符串(忽略大小写)
    let reg  = new RegExp('ab','i');
       let str = 'Abc';
     console.log(reg.test(str))  

方式2:字面量创建:

let reg=/正则表达式/匹配模式  
 匹配模式:
   i:忽略大小写
   g:全局匹配
   ig:忽略大小写,且全局匹配
   m:多行匹配
        let reg = /a/i;
        let str = 'Abc';
        console.log(reg.test(str))*/

3.常用匹配规则:

正则表达式中可以使用[]来匹配大范围的数字或字母,他们表示或者的关系,如下所示:

    • [a-z] 小写的 a-z之间的字符串
    • [A-Z] 大写的 A-Z之间的字符串
    • [A-z] 匹配的 A-z(大小写)之间的字符串
    • [0-9] 匹配数字
    • [^a-z] 除了小写的 a-z之间的字符串
    • [^A-Z] 除了大写的 A-Z之间的字符串
    • [^A-z] 匹配除了的 A-z(大小写)之间的字符串
    • [^0-9] 匹配除了数字

4.正则方法:

实际上就是字符串方法的参数改为正则表达式

          let str = "a1b2c3d5e6f8";
           //将字符串中分割字符串方法中的分割符参数改为正则表达式匹配的字符串
        // // let result = str.split(/[A-z]/);
        // let result = str.split(/[0-9]/);
        // console.log(result)
  
          // let str = "hello abc hello aec arc";
        // 搜索字符串  没有没有找到返回-1
        //只会返回第一个遇到的字符串
        // let result = str.search(/a[be]c/);
        // console.log(result)
       //提取符合正则表达式的内容
        // let str = "a1b2c3d5e6f8SENJHJ568";
        // // let result = str.match(/[a-z]/ig);
        // let result = str.match(/[A-z]/g);
        // console.log(result)
    //替换replace 第一个参数为 要替换的内容(可以是正则表达式)
    let str = "a1b2c3d5e6f8SENJHJ568";
    let result = str.replace(/[A-z]/g, "&");
    console.log(result)

5.正则量词:

1.语法规则:

  注意:**只匹配{}外第一个字符**,如果要匹配多个则要使用()将需要匹配的字符括起来
       {n} 正好出现n次
       {m,} 正好出现m次
       {m,n} 正好出现m-n次
       + 最少出现一次 类似于 {1,}
       * 0个或者多个 {0,}
       ? 0个或者1个 {0,1}

2.示例:

    let str = "b";
    // b 连续出现三次
     let reg = /b{3}/i;
    console.log(reg.test(str)) ;   

      let str = "ababab";
      ab 在字符串中连续出现3次
      let reg = /(ab){3}/i;
      console.log(reg.test(str)) ;

        let str = "bbbbbbb";
     //  b 连续最少出现三次  最多无上限
        let reg = /b{3,}/i;
        console.log(reg.test(str)) ;

        let str = "bbbbbbb";
     // /^开头   正则   $结尾/匹配模式
    // b 连续最少出现三次  最多5次
        let reg = /^b{3,5}$/i  ; 
        console.log(reg.test(str)) ;

     let str = "bbbbbbb";
    //最少出现一次
     let reg = /^b+$/i;
     console.log(reg.test(str)) ;

     let str = "bbbbbbb";
    // 0个或者多个
     let reg = /^b*$/i;
   console.log(reg.test(str)) ; 

        let str = "bbbbbbb";
      //0 个或者一个
       let reg = /^b?$/i;
      console.log(reg.test(str)) 

6.其他匹配规则:

1.语法:

  \.: 表示匹配'.' 
  \\:表示匹配'\'  
  \w:表示任意的字母 数字 下划线
  \W:表示除了任意的字母 数字 下划线
  \d:表示任意的数字
  \D:表示除了任意的数字
  \s:匹配空格
  \S:除了空格
  \b:单词边界
  \B:除了单词边界

2.正则匹配汇总:

3.示例:

    let reg = /^\D$/
     let str = "1";
  console.log(reg.test(str))        

         let str = " hello zs ";
         //替换开头和结尾的两个空格为*
         let reg = /^\s*|\s*$/g
          console.log(str.replace(reg, "*"))

          let str = "hello zs";
         let reg = /\bzs\b/
         console.log(reg.test(str))

     
     let emailStr = "asd1.57@aliyun.com.cn";
     let emailReg = /^\w{3,}(\.\w+)*@[A-z0-9]+(\.[A-z]{2,5}){1,2}$/
     console.log(emailReg.test(emailStr))  


网站公告

今日签到

点亮在社区的每一天
去签到