Home Web Front-end JS Tutorial js array operation example analysis

js array operation example analysis

Mar 26, 2018 pm 03:20 PM
javascript Case Analysis operate

This article mainly shares with you the analysis of js array operation examples, mainly in the form of code, hoping to help everyone.

shift: Delete the first item of the original array and return the value of the deleted element; if the array is empty, return undefined

var a = [1,2,3,4,5];   
var b = a.shift(); //a:[2,3,4,5] b:1
Copy after login

unshift: Add parameters to the beginning of the original array and return the length of the array

var a = [1,2,3,4,5];   
var b = a.unshift(-2,-1); //a:[-2,-1,1,2,3,4,5] b:7
Copy after login

Note: The test return value under IE6.0 is always undefined, and the test return value under FF2.0 is 7, so the return value of this method is unreliable. When you need to use the return value, splice can be used instead of this method.

pop: Delete the last item of the original array and return the value of the deleted element; if the array is empty, return undefined

var a = [1,2,3,4,5];   
var b = a.pop(); //a:[1,2,3,4] b:5
Copy after login

push: Add parameters to the end of the original array, and return the length of the array

var a = [1,2,3,4,5];   
var b = a.push(6,7); //a:[1,2,3,4,5,6,7] b:7
Copy after login

concat: Return a new array, which is composed of adding parameters to the original array

var a = [1,2,3,4,5];   
var b = a.concat(6,7); //a:[1,2,3,4,5] b:[1,2,3,4,5,6,7]
Copy after login

splice(start,deleteCount,val1,val2,...): Delete deleteCount items from the start position and insert val1, val2,...

var a = [1,2,3,4,5];   
var b = a.splice(2,2,7,8,9); //a:[1,2,7,8,9,5] b:[3,4]   
var b = a.splice(0,1); //同shift   
a.splice(0,0,-2,-1); var b = a.length; //同unshift   
var b = a.splice(a.length-1,1); //同pop   
a.splice(a.length,0,6,7); var b = a.length; //同push
Copy after login

reverse: Reverse the array

var a = [1,2,3,4,5];   
var b = a.reverse(); //a:[5,4,3,2,1] b:[5,4,3,2,1]
Copy after login

sort(orderfunction): Sort the array according to the specified parameters

var a = [1,2,3,4,5];   
var b = a.sort(); //a:[1,2,3,4,5] b:[1,2,3,4,5]
Copy after login

slice(start,end): Returns a new array composed of items from the specified start index to the end index in the original array

var a = [1,2,3,4,5];   
var b = a.slice(2,5); //a:[1,2,3,4,5] b:[3,4,5]
Copy after login

join(separator): The elements of the array form a string, with separator as the separator. If omitted, the default comma is used as the separator

var a = [1,2,3,4,5];   
var b = a.join("|"); //a:[1,2,3,4,5] b:"1|2|3|4|5"
Copy after login

The array is an internal object provided by JavaScript. It is an For a standard collection, we can add (push), delete (shift) elements, and we can also traverse the elements through a for loop. So besides arrays, can we have other collections in JavaScript?

Due to the language characteristics of JavaScript, we can dynamically add and delete properties to general objects. So Object can also be regarded as a special collection of JS. Let’s compare the characteristics of Array and Object:

  //Array:  
  
/*新建:*/var ary = new Array(); 或 var ary = [];   
/*增加:*/ary.push(value);   
/*删除:*/delete ary[n];   
/*遍历:*/for ( var i=0 ; i < ary.length ; ++i ) ary[i];  
  
  //Object:  
  
/*新建:*/var obj = new Object(); 或 var obj = {};   
/*增加:*/obj[key] = value; (key为string)   
/*删除:*/delete obj[key];   
/*遍历:*/for ( var key in obj ) obj[key];
Copy after login

From the above comparison, we can see that Object can be used as a collection. When using the Popup window to create unlimited web pages In Menu (3), I introduced the __MenuCache__ implemented by Eric, which is also a simulated collection object.

If we want to retrieve a specified value in Array, we need to traverse the entire array:

var keyword = ;   
  for ( var i=0 ; i < ary.length ; ++i )   
  {   
  if ( ary[i] == keyword )   
  {   
  // todo   
  }   
  }
Copy after login

And we are To retrieve an entry with a specified key in Object, just use:

var key = &#39;&#39;;   
  var value = obj[key];   
  // todo
Copy after login

 Object的这个特性可以用来高效的检索Unique的字符串集合,遍历Array的时间复杂度是O(n),而遍历Object的时间复杂度是O(1)。虽然对于10000次集合的for检索代价也就几十ms,可是如果是1000*1000次检索或更多,使用Object的优势一下就体现出来了。在此之前我做了一个mapping,把100个Unique的字符mapping到1000个字符串数组上,耗时25-30s!后来把for遍历改成了Object模拟的集合的成员引用,同样的数据量mapping,耗时仅1.7-2s!!! 
对于集合的遍历效率(从高到低):var value = obj[key]; > for ( ; ; ) > for ( in )。效率最差的就是for( in )了,如果集合过大,尽量不要使用for ( in )遍历。

相关推荐:

JS数组去重方法总结

js数组常用的一些排序法

JS数组添加元素方法总结

The above is the detailed content of js array operation example analysis. For more information, please follow other related articles on the PHP Chinese website!

Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

AI Hentai Generator

AI Hentai Generator

Generate AI Hentai for free.

Hot Article

R.E.P.O. Energy Crystals Explained and What They Do (Yellow Crystal)
3 weeks ago By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Best Graphic Settings
3 weeks ago By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. How to Fix Audio if You Can't Hear Anyone
3 weeks ago By 尊渡假赌尊渡假赌尊渡假赌
WWE 2K25: How To Unlock Everything In MyRise
4 weeks ago By 尊渡假赌尊渡假赌尊渡假赌

Hot Tools

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

PyCharm usage tutorial: guide you in detail to run the operation PyCharm usage tutorial: guide you in detail to run the operation Feb 26, 2024 pm 05:51 PM

PyCharm is a very popular Python integrated development environment (IDE). It provides a wealth of functions and tools to make Python development more efficient and convenient. This article will introduce you to the basic operation methods of PyCharm and provide specific code examples to help readers quickly get started and become proficient in operating the tool. 1. Download and install PyCharm First, we need to go to the PyCharm official website (https://www.jetbrains.com/pyc

What is sudo and why is it important? What is sudo and why is it important? Feb 21, 2024 pm 07:01 PM

sudo (superuser execution) is a key command in Linux and Unix systems that allows ordinary users to run specific commands with root privileges. The function of sudo is mainly reflected in the following aspects: Providing permission control: sudo achieves strict control over system resources and sensitive operations by authorizing users to temporarily obtain superuser permissions. Ordinary users can only obtain temporary privileges through sudo when needed, and do not need to log in as superuser all the time. Improved security: By using sudo, you can avoid using the root account during routine operations. Using the root account for all operations may lead to unexpected system damage, as any mistaken or careless operation will have full permissions. and

Linux Deploy operation steps and precautions Linux Deploy operation steps and precautions Mar 14, 2024 pm 03:03 PM

LinuxDeploy operating steps and precautions LinuxDeploy is a powerful tool that can help users quickly deploy various Linux distributions on Android devices, allowing users to experience a complete Linux system on their mobile devices. This article will introduce the operating steps and precautions of LinuxDeploy in detail, and provide specific code examples to help readers better use this tool. Operation steps: Install LinuxDeploy: First, install

What to do if you forget to press F2 for win10 boot password What to do if you forget to press F2 for win10 boot password Feb 28, 2024 am 08:31 AM

Presumably many users have several unused computers at home, and they have completely forgotten the power-on password because they have not been used for a long time, so they would like to know what to do if they forget the password? Then let’s take a look together. What to do if you forget to press F2 for win10 boot password? 1. Press the power button of the computer, and then press F2 when turning on the computer (different computer brands have different buttons to enter the BIOS). 2. In the bios interface, find the security option (the location may be different for different brands of computers). Usually in the settings menu at the top. 3. Then find the SupervisorPassword option and click it. 4. At this time, the user can see his password, and at the same time find the Enabled next to it and switch it to Dis.

Huawei Mate60 Pro screenshot operation steps sharing Huawei Mate60 Pro screenshot operation steps sharing Mar 23, 2024 am 11:15 AM

With the popularity of smartphones, the screenshot function has become one of the essential skills for daily use of mobile phones. As one of Huawei's flagship mobile phones, Huawei Mate60Pro's screenshot function has naturally attracted much attention from users. Today, we will share the screenshot operation steps of Huawei Mate60Pro mobile phone, so that everyone can take screenshots more conveniently. First of all, Huawei Mate60Pro mobile phone provides a variety of screenshot methods, and you can choose the method that suits you according to your personal habits. The following is a detailed introduction to several commonly used interceptions:

Simple JavaScript Tutorial: How to Get HTTP Status Code Simple JavaScript Tutorial: How to Get HTTP Status Code Jan 05, 2024 pm 06:08 PM

JavaScript tutorial: How to get HTTP status code, specific code examples are required. Preface: In web development, data interaction with the server is often involved. When communicating with the server, we often need to obtain the returned HTTP status code to determine whether the operation is successful, and perform corresponding processing based on different status codes. This article will teach you how to use JavaScript to obtain HTTP status codes and provide some practical code examples. Using XMLHttpRequest

PHP string manipulation: a practical way to effectively remove spaces PHP string manipulation: a practical way to effectively remove spaces Mar 24, 2024 am 11:45 AM

PHP String Operation: A Practical Method to Effectively Remove Spaces In PHP development, you often encounter situations where you need to remove spaces from a string. Removing spaces can make the string cleaner and facilitate subsequent data processing and display. This article will introduce several effective and practical methods for removing spaces, and attach specific code examples. Method 1: Use the PHP built-in function trim(). The PHP built-in function trim() can remove spaces at both ends of the string (including spaces, tabs, newlines, etc.). It is very convenient and easy to use.

How to bind WeChat on Ele.me How to bind WeChat on Ele.me Apr 01, 2024 pm 03:46 PM

Ele.me is a software that brings together a variety of different delicacies. You can choose and place an order online. The merchant will make it immediately after receiving the order. Users can bind WeChat through the software. If you want to know the specific operation method , remember to check out the PHP Chinese website. Instructions on how to bind WeChat to Ele.me: 1. First open the Ele.me software. After entering the homepage, we click [My] in the lower right corner; 2. Then in the My page, we need to click [Account] in the upper left corner; 3. Then come to the personal information page where we can bind mobile phones, WeChat, Alipay, and Taobao. Here we click [WeChat]; 4. After the final click, select the WeChat account that needs to be bound in the WeChat authorization page and click Just [Allow];

See all articles