Should altering arrays in several functions be avoided?

In my application, I have declared an array at the top:

let arr = [1,2,3,4]

There are two methods running in the background.

Method 1

Array.prototype.numberOfCoolElements = function(){
          doSomething();
          doOtherThings();

          // Meanwhile, method2 will be called

          return this.length;
}

Method 2

Array.prototype.changeTheLength = function(){
          this[100] = 123;
}

If both methods are running asynchronously with the same array reference:

Is it possible for the length of the array to change after numberOfCoolElements is called and before it finishes?

Answer №1

Unfortunately, achieving this is not possible due to the run-to-completion semantics of JavaScript. For more information, you can visit: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/EventLoop.

Here's a relevant quote:

This provides some advantageous properties when it comes to analyzing your program, such as the assurance that when a function is running, it cannot be interrupted and will finish entirely before any other code runs (and has the ability to modify data that the function uses)

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Obtain the inner text input value using jQuery

In my form, there is a feature that adds a new row of text inputs dynamically when a user wants to add more rows. Each new row is automatically populated with input fields that have the same id and class as the previous ones. My question is: how can I re ...

Integrate dat.GUI directly into a THREE.js scene without the use of an <iframe> tag

When a THREE.js scene takes up the full html page, the dat.GUI is embedded within the scene itself, as shown in this example. However, when the THREE.js scene does not occupy the entire page, positioning the dat.GUI becomes more complicated. The examples ...

A step-by-step guide on enhancing error message handling for Reactive forms in Angular

Here is a code snippet that I'm working on: public errorMessages; ngOnInit(): void { this.startErrorMessage(); } private startErrorMessage() { this.errorMessages = maxLength: this.translate.instant(' ...

Issues with sending FormData through Ajax POST requests over a secure HTTPS connection

We are currently experiencing issues with uploading pictures to our server. The process works smoothly on http sites, but encounters errors on https sites. An error message is displayed:https://i.sstatic.net/hPMZv.png Failed to load resource: the server r ...

What is the possible reason behind the Vue warning message: "The instance is referencing the 'msg' property or method during rendering, even though it is not defined"?

Although the situation seems straightforward, the reason behind it is not clear to me. I am attempting to create a Vue component for a project with older ES5 code. The Vue library version I am using is 2.6x (I also tried 2.5x). Here is the Vue component I ...

Tips for transmitting a batch of resources with Restangular?

Suppose I need to make a DELETE request to delete multiple products from the resource /products. The complete request should be sent to this URI: /products/ids=1&ids=2&ids=3 What is the method to send a request like this using Restangular? The c ...

The scope's attribute is present, but the variable within the scope's attribute is not

Currently, I am delving into angularJS development, but encountering a perplexing issue. I am attempting to format a JSON into a table with intricate rules. The JSON structure currently is as follows: { "id":"test", "title":"Test Sample", "de ...

Tips for ensuring a method is not invoked more than once with identical arguments

I'm grappling with a challenge in JavaScript (or typescript) - ensuring that developers cannot call a method multiple times with the same argument. For instance: const foo = (name: string) => {} foo("ABC") // ok foo ("123") ...

Ways to prevent the TAB key from automatically shifting focus to the next element after using scrollIntoView during page initialization in the Chrome browser

Encountering a strange issue specifically on the Chrome browser. After the page loads, I am using the scrollIntoView method in the ngAfterViewInit of an Angular component. When the page loads and scrolls to the element, everything appears to be functioning ...

Refreshing Javascript with AngularJS

I'm encountering an issue while starting my angular js application. On a html page, I have divs with icons and I want the background color to change on mouse over. This is working using jquery's $(document).ready(function(){ approach. The conten ...

What is the method for extracting JavaScript code as data from a script tag?

I have a file external (let's say bar.js) function qux() {} Then in my webpage, I include it using the script tag: <script type="text/javascript" src="bar.js"></script> I am looking for a way to retrieve the JavaScript code from within ...

Include a new key and its corresponding value to an already existing key within FormData

I have a form that includes fields for title, name, and description. My goal is to submit the form values using an API. To achieve this, I am utilizing jQuery to add key-value pairs to the FormData variable: formdata.append('description_text', jq ...

No content in webpack result file when using express and react

Trying to implement webpack into the basic react comment list tutorial has been a bit of a challenge for me. Everything seems to be functioning properly, but my output file never actually contains any content. Let's take a look at my webpack configur ...

Using React Native to display an SVG path inside an SVG viewbox

I'm working on incorporating a barcode scanner viewfinder with an SVG icon to enhance its appearance. However, I am facing difficulty in making the path element within the SVG take up the full width and height of the SVG. In my React Native project, I ...

How to access the CSS and JS files in the vendor folder using linemanjs

Currently, I am in the process of developing a web application utilizing linemanjs. However, I have encountered an issue where the vendor css and js files are not being referenced correctly when explicitly included. I would appreciate any guidance on what ...

What is the mechanism behind JSON.parse()?

As I delve into the realm of using JavaScript to parse an object retrieved from a PHP file, a snippet of pertinent code catches my attention: var name = document.getElementBId("name").value; var XHR = new XMLHttpRequest(); XHR.open("GET', 'looku ...

What is the correct method for adding a button to a popup in Leaflet Draw?

I need a button within a popup that can perform an action on the attached layer. L.marker(coors[i], { icon }) .addTo(this.drawnItem) .bindPopup(this._getCustomIcon(mix)) .openPopup(); Here is my _getCustomIcon() function: ...

Direct the /username path to /[user]/[tab].js instead of [user]/index.js in Next.js

My goal is to develop a user profile page that displays content based on the current tab the user is viewing. The tab is determined by what is provided in the URL (e.g. /username/tab1). The challenge I am facing is that one of the tabs the user can access ...

What is the method for retrieving data from the root component within a child template in VueJs?

How can I access this.$root from within a VueJs template? For example: <template> <v-card elevation="this.$root.$refs.foo.cardElevation"> Foo </v-card> </template> I am aware that I can create a data property and ...

Arrange an array by choosing the instances using VBA

Currently, I am in the process of developing a Solidworks macro using VBA that involves setting an array with x, y, and arctan values for notes. The next step is to sort this array using a bubblesort method. This array is single dimensional and follows a s ...