selectedItems= [5,47]
if(this.selectedItems.length > 1)
{
this.selectedItems= this.selectedItems.splice(0,1);
}
I am attempting to remove the element at index 0 which is 5 but unexpectedly it deletes the element at index 1 which is 47.
How come?
By not assigning the result of the splice function, which is [1], back to the original this.selectedRoles:
this.selectedRoles = this.selectedRoles.splice(0,1);
All you need to do is remove the assignment like so:
this.selectedRoles.splice(0,1);
this.selectedRoles // will be [230]
The reason for this is that you completed the task.
this.selectedRoles = this.selectedRoles.splice(0,1);
Simply write the code like this:
this.selectedRoles.splice(0,1);
The official documentation states that Array.prototype.splice is a function that operates directly on the given array.
When you use the splice() method, it directly modifies the contents of the array by either removing existing elements, replacing them, or adding new elements at specific positions within the array.
In the line this.selectedRoles.splice(0,1), the item that is removed by the splice operation is returned and then assigned back to this.selectedRoles.
It is advisable not to directly assign the result of the splice method back to the original array variable.
selectedRoles= [1,230]
if(this.selectedRoles.length > 1)
{
this.selectedRoles.splice(0,1);
}
It appears there may be a misunderstanding regarding the functionality of the splice method.
When using this.selectedRoles.splice(0,1), the returned value is the element removed, not what remains in the array. This leads to the unexpected result of 1 being returned. Furthermore, by assigning it back to the same variable, the old array is replaced with the edited values.
Return Value of Splice
The deleted elements are returned in an array format. If only one element is removed, a single-element array is returned. If no elements are removed, an empty array is returned.
If the goal is to remove the first index when the array length exceeds 1, using slice instead of splice might be more suitable. Slice does not modify the original array; instead, it creates a shallow copy of the array's elements. More details can be found here.
While browsing through StackOverflow, I came across a post detailing how to transfer shader examples from ShaderToy into Three.js. You can find the post here. I followed the steps mentioned in the post and created this Plunker demo. The fragment shader co ...
My goal is to save the datepicker date to MySQL by selecting the date format using JavaScript. I have verified that the date format appears correct as YYYY-MM-DD when logging to the console. However, when I try to execute an INSERT query to MySQL, the date ...
Just starting out with the MEAN stack, I've included my API code below where I'm using res.json(random) to send a random password. module.exports.changePass = function (req, res) { console.log(req.body.email) db.user.find({ where: { name: ...
Despite my efforts, I am still struggling to make jquery work in rails. I have installed the 'jquery-rails' gem and added the require statements in the application.js file. Below is a sample test page that I have been testing: <!DOCTYPE htm ...
After one backspace move, the cursor on the phone number field automatically moves to the end which can be inconvenient if the user only wants to edit the area code. Unfortunately, I am unable to post images at the moment due to insufficient reputation. B ...
In my React Native app, we recently integrated TypeScript and I'm in charge of migrating the unit tests. One particular test is failing unexpectedly. The app includes a <LoginForm /> component that utilizes Formik. //... imports export inte ...
Being relatively new to react, I’ve adopted a method of defining default values which looks like this: class TextInput extends Component { render() { return ( <input type="text" name={ this.pr ...
Below is some nodejs code that I am working with. The client initially calls /api/demosounds and then calls /api/testsounds. var glob = require('glob-fs')({ gitignore: true }); app.get('/api/demosounds',function(req,res){ var d ...
Upon loading the page, I have implemented a code that randomizes the order of the child divs. Here is the code snippet: function reorder() { var grp = $("#team-posts").children(); var cnt = grp.length; var temp, x; for (var i = 0; i < cnt; ...
Recently, I've been exploring jQuery Javascript Templates and trying to follow a tutorial that involves fetching tweets from Twitter. The tutorial can be found here: . After carefully implementing the code as instructed, you can view my progress on t ...
I'm currently working on a small project that involves creating lists of products in a certain format. For example: let products = createList( new Product('product1'), new Product('product2') ) When it comes to accessing a s ...
I ran into an issue with my Vite project yesterday. I closed it and now that I have reopened it, the 'npm run dev' command is throwing an error. My project is built using Vite with React and TypeScript. Attached is a screenshot of the error mess ...
We have developed a unique PCB Viewer using THREE.js, but now we want to enhance it with selection functionality. While the task itself isn't complex and I have managed to make it work, I am encountering performance challenges. Our goal is to allow us ...
I have encountered an issue while implementing a Stripe promise in my React app. The documentation suggests loading the promise outside of the component to prevent unnecessary recreations of the `Stripe` object: import {Elements} from '@stripe/react-s ...
Is it possible to run a function when there is a change in either a document within the parent collection or a document within one of its subcollections? I have tried using the code provided in the Firebase documentation, but it only triggers when a docume ...
I'm a beginner with Bootstrap and I'm attempting to trigger the .collapse() function using JavaScript within an Angular controller when a user clicks on a link. The goal is to close the collapsible navbar when a link is clicked, as the routing in ...
Currently, I am fetching data using AJAX from the Vue instance and trying to pass it onto different components. As I delve deeper into learning Vue.js, I can't help but notice that the documentation seems a bit scattered... This snippet showcases wha ...
Is it possible to drag an element on the page into a droppable element inside an ajax loaded div? The code works fine when the droppable element is placed directly in the regular page, but not within the ajax loaded div. It seems like the issue may be rela ...
When multiple is set to true, I prefer the Chip option. Is there a way to enable the Chip functionality even when multiple is set to false? <Autocomplete className={classes.search} options={top100Films} ge ...
How can I simultaneously upload images and form content? Is it possible to upload both to the client first and then to the server together with the form content? I'm looking to submit the form content along with the image to the server in one go when ...