JS常见面试题之数组篇（一）

一只眼镜猫
146 阅读8分钟

整理了一些js常用的基础知识，如有问题，欢迎指正~

数组的常用方法

1. Array.push();

  • 定义：向数组的末尾添加一个或多个元素，并返回新的数组长度。原数组改变。
  • 语法：array.push(item1, item2, ..., itemX)。
  • 返回值：数值，表示数组的长度。
  • 示例：
    var fruits = ["Banana", "Orange", "Apple", "Mango"];
    fruits.push("kiwi");//添加一个元素，返回5
    fruits.push("Kiwi", "Lemon", "Pineapple");//添加多个元素，返回7

2. Array.pop();

  • 定义：移除数组的最后一个元素，并返回该元素。原数组改变。
  • 语法：array.pop()
  • 返回值：任何类型，表示被删除的数组项（数组项可以是字符串、数字、数组、布尔值或数组中允许的任何其他对象类型。）。
  • 示例：
    var fruits = ["Banana", "Orange", "Apple", "Mango"];
    fruits.pop();//返回"Mango"

3. Array.unshift();

  • 定义：向数组的开头添加一个或多个元素，并返回新的数组长度。原数组改变。
  • 语法：array.unshift(item1,item2,...,itemX)
  • 返回值：数值，表示数组的长度。
  • 示例：
    var fruits = ["Banana", "Orange", "Apple", "Mango"];
    fruits.unshift("kiwi");//返回5

4. Array.shift();

  • 定义：移除数组的第一个元素，并返回该元素。原数组改变。
  • 语法：array.shift()
  • 返回值：从array中删除第一个元素并返回该值，如果数组为空，则返回 undefined。
  • 示例：
    var fruits = ["Banana", "Orange", "Apple", "Mango"];
    fruits.shift(); //返回"Banana"
    
    var fruits = [];
    fruits.shift(); //返回undefined

5. Array.slice();

  • 定义：取给定数组的一部分并将其返回。此方法不会更改原始数组。
  • 语法：
    • array.slice(start,end)。
    • start可选，它表示方法开始提取元素的索引，如果该参数为负数， 则表示从原数组中的倒数第几个元素开始提取。
    • end可选，表示方法停止提取元素的位置的索引。
    • 在只有一个参数的情况下， slice()方法返回从该参数指定位置开始到当前数组末尾的所有项。
    • 如果有两个参数， 该方法返回起始和结束位置之间的项——但不包括结束位置的项。
  • 返回值：包含提取的元素的新数组。
  • 示例：
    var fruits = ["Banana", "Orange", "Apple", "Mango"];
    var cart = fruits.slice(1,2);
    console.log(cart);//Orange
    
    var cart = fruits.slice(0,3);
    console.log(cart); //["Banana", "Orange", "Apple"]
        
    var cart = fruits.slice(1);
    console.log(cart); // ["Orange", "Apple", "Mango"]
    
    var cart = fruits.slice(0);
    console.log(cart); // ["Banana", "Orange", "Apple", "Mango"]
    
    var cart = fruits.slice(-1);
    console.log(cart); //heart.html:232 ["Mango"]
    
     var cart = fruits.slice(-1);
    console.log(cart); // ["Mango"]
    
    var cart = fruits.slice(-4,-1);
    console.log(cart); // ["Banana", "Orange", "Apple"]

6. Array.splice();

  • 定义：用于从当前数组中移除一部分连续的元素。如有必要，还可以在所移除元素的位置上插入一个或多个新的元素。该函数以数组形式返回从当前数组中被移除的元素。
  • 语法：array.splice(index, howmany, item1, ....., itemX)
    • index 必需。整数，指定在什么位置添加/删除项目，使用负值指定从数组末尾开始的位置，如果index>=array.length则不会移除任何元素，返回一个空数组。
    • howmany 可选。要删除的项目数。如果设置为 0或者负数，则不会删除任何项目，并返回一个空数组。
    • item1, ..., itemX 可选。要添加到数组中的新项目,如果不指定任何元素，拼接只需删除该数组中的元素。
  • 返回值：新数组，包含删除的项目（如果有）。
  • 示例：
   // 将项目添加到数组   
    var fruits = ["Banana", "Orange", "Apple", "Mango"];
    fruits.splice(2,0,"Lemon","Kiwi");
    console.log(fruits); // ["Banana", "Orange", "Lemon", "Kiwi", "Apple", "Mango"]
    
   // 添加新项目，并删除 1 个项目
   fruits.splice(2,1,"Lemon","Kiwi");
   console.log(fruits); // ["Banana", "Orange", "Lemon", "Kiwi", "Mango"]
   
   // 删除2 个项目
    fruits.splice(2,1,"Lemon","Kiwi");
   console.log(fruits); // ["Banana", "Orange"]

7. Array.join();

  • 定义：将数组中所有元素都转化为字符串并连接在一起，返回最后生成的字符串。元素将由指定的分隔符分隔。默认分隔符是逗号 (,)。不会改变原始数组。
  • 语法：array.join(separator)
    • separator可选。要使用的分隔符。如果省略，元素用逗号分隔。
  • 返回值：字符串值，表示数组值，由指定的分隔符分隔。
  • 示例：
 var fruits = ["Banana", "Orange", "Apple", "Mango"];
 var energy = fruits.join();
 console.log(energy); // Banana,Orange,Apple,Mango
 
 var energy = fruits.join(" and ");
 console.log(energy); // Banana and Orange and Apple and Mango
 
 var vegetable = new Array(10); // 长度为10的空数组
 vegetable.join('-');           // => "---------"：9个连字号组成的字符串

8. Array.concat();

  • 定义：用于连接两个或多个数组，不会更改现有数组，而是返回一个新数组，其中包含已连接数组的值。
  • 语法：array1.concat(array2, array3, ..., arrayX)
    • array2, array3, ..., arrayX 必需。要链接的数组。
  • 返回值：Array 对象，表示已连接的数组。
    • 如果当前数组中的元素是对象引用， 则在返回的连接后的新数组中仍然是以对象引用的形式存在， 并不会创建一个等同的对象。 简而言之， 如果当前数组中的元素是对象，新数组中的元素还是这个对象， 它们指向同一个对象。
  • 示例：
 var fruits = ["Banana", "Orange", "Apple", "Mango"];
 var animal = ["Horse","Dog","Cat","Bird"];
 var love = fruits.concat(animal)
 console.log(love); // ["Banana", "Orange", "Apple", "Mango", "Horse", "Dog", "Cat", "Bird"]
 
 //如果当前数组中的元素是对象，新数组中的元素还是这个对象， 它们指向同一个对象。
 var friend = {
     name:"张三",
     age:17
 }
var love = fruits.concat(friend)
console.log(love); // ["Banana", "Orange", "Apple", "Mango", {name: "张三", age: 17}]

9. Array.reverse();

  • 定义：反转数组中元素的顺序，将改变原始数组。
  • 语法：array.reverse()；
  • 返回值：数组，表示反转后的数组。
  • 示例：
var fruits = ["Banana", "Orange", "Apple", "Mango"];
console.log(fruits.reverse()); // ["Mango", "Apple", "Orange", "Banana"]

10. Array.sort();

  • 定义：对数组的项目进行排序。
    • 排序顺序可以是按字母或数字，也可以是升序（向上）或降序（向下）。
    • 默认情况下，sort() 方法将按字母和升序将值作为字符串进行排序。这适用于字符串（"Apple" 出现在 "Banana" 之前）。但是，如果数字按字符串排序，则 25 大于 "100" ，因为 "2" 大于 "1"。正因为如此，sort() 方法在对数字进行排序时会产生不正确的结果。
  • 语法：array.sort(compareFunction)；
    • compareFunction 可选。定义替代排序顺序的函数。该函数应返回负值、零值或正值，具体取决于参数，例如：function(a, b){return a-b} sort() 方法比较两个值时，将值发送给比较函数，根据返回的（负、零、正）值对值进行排序。
  • 返回值：Array 对象，其中的项目已排序。
  • 示例：
  var fruits = ["Banana", "Orange", "Apple", "Mango"];
  console.log(fruits.sort()) // ["Apple", "Banana", "Mango", "Orange"]
  
  //对数值进行排序 错误示例 
  var points = [40, 100, 1, 5, 25, 10];
  console.log(points.sort()) //[1, 10, 100, 25, 40, 5]
        
  //按升序对数组中的数字进行排序：
  var points = [40, 100, 1, 5, 25, 10];
  points.sort((a,b) => a - b);
  console.log(points); ..[1, 5, 10, 25, 40, 100]
  
  //按降序对数组中的数字进行排序：
  var points = [40, 100, 1, 5, 25, 10];
  points.sort((a,b) => b - a);
  console.log(points); //[100, 40, 25, 10, 5, 1]
  
  //获取数组中的最小值：
  var points = [40, 100, 1, 5, 25, 10];
  points.sort((a,b) => a - b);
  console.log(points[0]); // 1
  
  //获取数组中的最大值：
  var points = [40, 100, 1, 5, 25, 10];
  points.sort((a,b) => a - b);
  console.log(points[points.length - 1]); //100
  
  //根据数组对象的元素进行排序1。
var arr = [
    {name:'张三',height:160,heightUnit:'cm'},                
    {name:'王五',height:180,heightUnit:'cm'},
    {name:'李四',height:170,heightUnit:'cm'},
    {name:'赵六',height:130,heightUnit:'cm'}
]; 
var newArr = arr.sort(num);
function num (m,n){
    return m.height - n.height     
}
console.log(newArr);        
// {name: "赵六", height: 130, heightUnit: "cm"}
// {name: "张三", height: 160, heightUnit: "cm"}
// {name: "李四", height: 170, heightUnit: "cm"}
// {name: "王五", height: 180, heightUnit: "cm"}


//根据数组对象的元素进行排序2。
var arr = [
    {name:'张三',height:160,heightUnit:'cm'},                
    {name:'王五',height:180,heightUnit:'cm'},
    {name:'李四',height:170,heightUnit:'cm'},
    {name:'赵六',height:130,heightUnit:'cm'}
]; 
var newArr = arr.sort(compare('height'));
function Compare(property) {
    return function(a,b){
        var val1 = a[property]
        var val2 = b[property]
        return val1 - val2
    }
}
Aconsole.log(newArr);

11. Array.map();

  • 定义：返回一个新数组，数组中的元素为原始数组元素调用函数处理后的值。按照原始数组元素顺序依次处理元素。map() 不会对空数组进行检测。 不会改变原始数组。
  • 语法：array.map(function(currentValue,index,arr), thisValue)
    • function(currentValue, index,arr) 必须。函数，数组中的每个元素都会执行这个函数
    • 函数参数：currentValue 必须。当前元素的值 index 可选。当前元素的索引值.arr 可选。当前元素属于的数组对象
    • thisValue 可选。对象作为该执行回调时使用，传递给函数，用作 "this" 的值。如果省略了thisValue，或者传入 null、undefined，那么回调函数的 this 为全局对象。
  • 返回值：返回一个新数组，数组中的元素为原始数组元素调用函数处理后的值。
  • 示例：
//返回原始数组中所有值的平方根的数组：
var numbers = [4, 9, 16, 25];
var x = numbers.map(Math.sqrt)
var numbers = [4, 9, 16, 25];
var x = numbers.map(Math.sqrt)
console.log(x);       // [2, 3, 4, 5]
      
// 将数组中的所有值乘以 10：
var numbers = [4, 9, 16, 25];
function myFun(num) {
    return num*3
}
console.log(numbers.map(myFun)); // [12, 27, 48, 75]

//获取数组中每个人的全名：
var persons = [
    {firstname : "Malcom", lastname: "Reynolds"},
    {firstname : "Kaylee", lastname: "Frye"},
    {firstname : "Jayne", lastname: "Cobb"}
];
function getFullName(item) {
    var fullName = [item.firstname,item.lastname].join(" ");
    return fullName
}

console.log(persons.map(getFullName)); //  ["Malcom Reynolds", "Kaylee Frye", "Jayne Cobb"]

整理了一些JavaScript常见的面试题整理用于学习，如有问题欢迎指正，侵删~

avatar
文章
阅读
粉丝