Network Security Internet Technology Development Database Servers Mobile Phone Android Software Apple Software Computer Software News IT Information

In addition to Weibo, there is also WeChat

Please pay attention

WeChat public account

Shulou

What are the operation skills of JavaScript array

2025-03-28 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Development >

Share

Shulou(Shulou.com)06/01 Report--

What are the knowledge points of this article "JavaScript array operation skills?" most people do not understand, so the editor summarizes the following contents, detailed contents, clear steps, and has a certain reference value. I hope you can get something after reading this article. Let's take a look at this "JavaScript array operation skills" article.

1. Array deduplication

Only two feasible methods are shown here, one is the practical. From () method, and the second is the practical extension operator.

Let fruits = ["banana", "apple", "orange", "watermelon", "apple", "orange", "grape", "apple"] / / the first method let uniqueFruits = Array.from (new Set (fruits)) / / the second method let uniqueFruits2 = [. New Set (fruits)] 2. Replace a specific value in an array

We can use .splice (start, value to remove, valueToAdd), passing in three parameters that specify where to start the modification, how many values to change, and the newly added values.

Let fruits = ["banana", "apple", "orange", "watermelon", "apple", "orange", "grape", "apple"] fruits.splice (0,2, "potato", "tomato") console.log (fruits) / / returns ["potato", "tomato", "orange", "watermelon", "apple", "orange", "grape", "apple"] 3. Do not map arrays with .map ()

Maybe everyone knows the .map () method of the array, but you can use another scheme to get a similar effect, and the code is very concise. Here we can use the .from () method.

Let friends = [{name: 'John', age: 22}, {name:' Peter', age: 23}, {name: 'Mark', age: 24}, {name:' Maria', age: 22}, {name: 'Monica', age: 21}, {name:' Martha', age: 19},] let friendsNames = Array.from (friends, ({name}) = > name) console.log (friendsNames) / / returns ["John" "Peter", "Mark", "Maria", "Monica", "Martha"] 4. Empty the array

Do you have an array of all the elements that you need to clean up for any purpose and don't want to delete the elements one by one? It only takes a single line of code to do it. To empty an array, you need to set the length of the array to 0, that's all!

Let fruits = ["banana", "apple", "orange", "watermelon", "apple", "orange", "grape", "apple"]; fruits.length = 0 fruits.length console.log (fruits); / / returns [] 5. Array to object

We happen to have an array, but for some purpose, we need an object with this data, and the fastest way to convert an array to an object is to use the well-known extension operator.

Let fruits = ["banana", "apple", "orange", "watermelon"]; let fruitsObj = {... fruits}; console.log (fruitsObj) / / returns {0: "banana", 1: "apple", 2: "orange", 3: "watermelon", 4: "apple", 5: "orange", 6: "grape", 7: "apple"} 6. Populate the array with data

In some cases, when we create an array, we want to populate it with some data, or we need an array with the same value, in which case the. fill () method provides a simple and clean solution.

Let newArray = newArray (10). Fill ('1') console.log (newArray) / / returns ["1", "1", "1", "1", "1", "1", "1", "1", "1", "1"] 7. Merge array

In addition to using the .concat () method, we can also use the extension operator.

Var fruits = ["apple", "banana", "orange"]; var meat = ["poultry", "beef", "fish"]; var vegetables = ["potato", "tomato", "cucumber"]; var food = [... Fruits,... Meat,... Vegetables]; console.log (food); / / ["apple", "banana", "orange", "poultry", "beef", "fish", "potato", "tomato", "cucumber"] 8. Find the intersection of arrays

This is also one of the most common challenges you face in any JavaScript interview, because it shows whether you can use array methods and what your logic is.

Var numOne = [0,2,4,6,8,8]; var numTwo = [1,2,3,4,5,6]; var duplicatedValues = [... new Set (numOne)] .filter (item= > numTwo.includes (item)) console.log (duplicatedValues); / / returns [2,4,6] 9. Remove an imaginary value from an array

First, let's define an imaginary value. In JavaScript, the imaginary values are false, 0, ", null, NaN, undefined. Now we can figure out how to remove such values from the array. To do this, we will use the .filter () method.

Var mixedArr = [0, "blue", ", NaN, 9, true, undefined," white ", false]; var trueArr = mixedArr.filter (Boolean); console.log (trueArr); / / returns [" blue ", 9, true," white "] 10. Get random values from an array

Sometimes we need to randomly select a value from the array. To create it in a simple, fast, and short way and keep our code clean, we can get random index numbers based on the length of the array. Let's take a look at the code:

Var colors = ["blue", "white", "green", "navy", "pink", "purple", "orange", "yellow", "black", "brown"]; var randomColor = colors [(Math.floor (Math.random () * (color.length)] 11. Invert the array var colors = ["blue", "white", "green", "navy", "pink", "purple", "orange", "yellow", "black", "brown"]; var reversedColors = colors.reverse (); console.log (reversedColors) / returns ["brown", "black", "yellow", "orange", "purple", "pink", "navy", "green", "white", "blue"] 12..lastIndexOf () method

In JavaScript, there is an interesting method that allows you to find the last occurrence index of a given element. For example, if our array has duplicate values, we can find where it last appeared. Let's take a look at the code example:

Var nums = [1, 5, 2, 6, 3, 5, 2, 3, 6, 5, 2, 7]; var lastIndex = nums.lastIndexOf (5); console.log (lastIndex); / / returns 913. The sum of all the values in the array var nums = [1,5,2,6]; var sum = nums.reduce ((x, y) = > x + y); console.log (sum); / / returns 14 is about "what are the operation skills of the JavaScript array" of this article, I believe you all have a certain understanding, I hope the content shared by the editor is helpful to you, if you want to know more about the relevant knowledge, please follow the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.

Views: 0

*The comments in the above article only represent the author's personal views and do not represent the views and positions of this website. If you have more insights, please feel free to contribute and share.

Share To

Development

Wechat

© 2024 shulou.com SLNews company. All rights reserved.

12
Report