JavaScript--数组和字符串常用方法

数组高级API

• 遍历数组的几种方法
  • 利用传统循环来遍历数组

  for(let i = 0; i < arr.length; i++){
               console.log(arr[i]);
           }
  

  • 利用for in循环来遍历数组

           // 注意点: 在企业开发中不推荐使用forin循环来遍历数组
  for(let key in arr){
              console.log(key);
              console.log(arr[key]);
  }
  

  • 利用ES6中推出的for of循环来遍历数组

  for(let value of arr){
              console.log(value);
  }
  

  • 还可以利用Array对象的forEach方法来遍历数组

  forEach方法会自动调用传入的函数
        // 每次调用都会将当前遍历到的元素和当前遍历到的索引和当前被遍历的数组传  递给这个函数
        arr.forEach(function (currentValue, currentIndex, currentArray) {
            // console.log(currentValue, currentIndex, currentArray);
            console.log(currentValue);
  });
  

• 数组的查找方法
  • findIndex方法

  findIndex方法: 定制版的indexOf, 找到返回索引, 找不到返回-1
        let index = arr.findIndex(function (currentValue, currentIndex, currentArray) {
            // console.log(currentValue, currentIndex, currentArray);
            // if(currentValue === 6){
            if(currentValue === 10){
                return true;
            }
        });
        console.log(index);
  

  • find方法

  find方法如果找到了就返回找到的元素, 如果找不到就返回undefined
        let value = arr.find(function (currentValue, currentIndex, currentArray) {
            // console.log(currentValue, currentIndex, currentArray);
            // if(currentValue === 6){
            if(currentValue === 10){
                return true;
            }
        });
        console.log(value);
  

数组的添加方法

• filter方法

将满足条件的元素添加到一个新的数组中
      let newArray = arr.filter(function (currentValue, currentIndex, currentArray) {
          // console.log(currentValue, currentIndex, currentArray);
          if(currentValue % 2 === 0){
              return true;
          }
      });
      console.log(newArray); // [2, 4]

• map方法

将满足条件的元素映射到一个新的数组中
      let newArray = arr.map(function (currentValue, currentIndex, currentArray) {
          // console.log(currentValue, currentIndex, currentArray);
          if(currentValue % 2 === 0){
              return currentValue;
          }
      });
      console.log(newArray); // [undefined, 2, undefined, 4, undefined]

• 数组的排序方法

  let arr = ["c", "a", "b"];
        arr.sort();
        /*
        如果 compareFunction(a, b) 小于 0 ，那么 a 会被排列到 b 之前；
        如果 compareFunction(a, b) 等于 0 ， a 和 b 的相对位置不变。
        如果 compareFunction(a, b) 大于 0 ， b 会被排列到 a 之前
        注意点: 如果元素是字符串类型, 那么比较的是字符串的Unicode编码
        */
        arr.sort(function (a, b) {
            if(a > b){
                return -1;
            }else if(a < b){
                return 1;
            }else{
                return 0;
            }
        });
        console.log(arr);

• 规律
  • 如果数组中的元素是数值类型
  • 如果需要升序排序, 那么就返回a - b;
  • 如果需要降序排序, 那么就返回b - a;

字符串常用方法

• 获取字符串长度

let str = "abcd";
console.log(str.length);

• 获取某个字符 [索引] / charAt

let str = "abcd";
let ch = str[1];
let ch = str.charAt(1);
console.log(ch);

• 字符串查找 indexOf / lastIndexOf / includes

let str = "vavcd";
let index = str.indexOf("v");
let index = str.lastIndexOf("v");
console.log(index);
let result = str.includes("p");
console.log(result);

• 拼接字符串 concat / +

let str1 = "www";
let str2 = "it666";
let str = str1 + str2; // 推荐
let str = str1.concat(str2);
console.log(str);

• 截取子串 slice / substring / substr

let str = "abcdef";
let subStr = str.slice(1, 3);
let subStr = str.substring(1, 3);
let subStr = str.substr(1, 3);
console.log(subStr);

• 字符串切割

let arr = [1, 3, 5];
let str = arr.join("-");
console.log(str);
let str = "1-3-5";
let arr = str.split("-");
console.log(arr);

• 判断是否以指定字符串开头 ES6

let str = "http://www.it666.com";
let result = str.startsWith("www");
console.log(result);

• 判断是否以指定字符串结尾 ES6

let str = "lnj.jpg";
let result = str.endsWith("png");
console.log(result);

• 字符串模板 ES6

let name = "lnj";
let age = 34;
// let str = "我的名字是" + name + ",我的年龄是" + age;
let str = `我的名字是${name},我的年龄是${age}`;
console.log(str);