Using the splice technique to include a new element

Question

Using the splice technique to include a new element

I have been attempting to use the JavaScript splice method to insert a "-" before each capital letter in my array, but it doesn't seem to be working as I expected. I'm not sure where I am going wrong. Below is the code that I have written:

function spinalCase(str) {
  let strArr = [];
  for(let i = 0; i < str.length; i++){
    strArr.push(str[i]);
  }
  for(let i = 0; i < strArr.length; i++){
    if(strArr[i] !== strArr[i].toLowerCase()){
      strArr.splice(strArr.indexOf(strArr[i]),0, "-");
    }
  } 
console.log(strArr);
}

spinalCase('thisIsSpinalTap');

javascript arrays string addition splice

Answer 1

Answer №1

By adding a new element using the splice method, the array's length increases and causes the loop to never reach its end. To avoid this issue, it is recommended to iterate through the array from the end to the beginning.

function convertToSpinalCase(str) {
  let strArray = [];
  for (let i = 0; i < str.length; i++) {
    strArray.push(str[i]);
  }

  // Iterate through the array from the end to the beginning
  for (let i = strArray.length - 1; i >= 0 ; i--) {
    if (strArray[i] !== strArray[i].toLowerCase()) {
      strArray.splice(strArray.indexOf(strArray[i]), 0, "-");
    }
  }
  console.log(strArray.join(''));
}

convertToSpinalCase('thisIsSpinalTap');

Answer 2

By adding a new element using the splice method, the array's length increases and causes the loop to never reach its end. To avoid this issue, it is recommended to iterate through the array from the end to the beginning.

function convertToSpinalCase(str) {
  let strArray = [];
  for (let i = 0; i < str.length; i++) {
    strArray.push(str[i]);
  }

  // Iterate through the array from the end to the beginning
  for (let i = strArray.length - 1; i >= 0 ; i--) {
    if (strArray[i] !== strArray[i].toLowerCase()) {
      strArray.splice(strArray.indexOf(strArray[i]), 0, "-");
    }
  }
  console.log(strArray.join(''));
}

convertToSpinalCase('thisIsSpinalTap');

Answer 3

Answer №2

Although you were considering using splice, allow me to present a regex solution as an alternative.

function hyphenateCamelCase(str) {
 return str.replace(/[A-Z]/g, "-$&").toLowerCase();
}

console.log(hyphenateCamelCase("thisIsSpinalTap"))
// this-is-spinal-tap

Answer 4

Although you were considering using splice, allow me to present a regex solution as an alternative.

function hyphenateCamelCase(str) {
 return str.replace(/[A-Z]/g, "-$&").toLowerCase();
}

console.log(hyphenateCamelCase("thisIsSpinalTap"))
// this-is-spinal-tap

Answer 5

Answer №3

Altering your array occurs when you perform the following action:

strArr.splice(strArr.indexOf(strArr[i]),0, "-");

As a result, the length of strArr is not consistent within the loop

for(let i = 0; i < strArr.length; i++)

Answer 6

Altering your array occurs when you perform the following action:

strArr.splice(strArr.indexOf(strArr[i]),0, "-");

As a result, the length of strArr is not consistent within the loop

for(let i = 0; i < strArr.length; i++)

Using the splice technique to include a new element

Answer №1

Answer №2

Answer №3

Similar questions

Is there a way to verify the existence of a key within server data using Javascript?

Ensure that each class element contains a value before using jQuery to toggle the disabled class

Tips for displaying JSON data within another array in a Bootstrap table

Verify whether an item is present in a jquery assembly

What is the best way to update an element in an array inside a JavaScript object

What are the methods for removing the color green with CSS or JavaScript?

Encountering an error in AngularJS $http calls while trying to loop: TypeError - object is not functioning

Run JavaScript code when the HTML file has been modified for the second time

"The server is refusing to process the request because it does not allow POST methods, only GET methods are

What is the best way to establish the render() method for an 'arrow' component?

Warning in Vue.js: Duplicate keys with the value of '0' have been detected, which could potentially lead to update errors. This issue was found within the Vue.js Bootstrap collapse

Waiting in Python using Selenium until a class becomes visible

What is the best way to pass individual values from an array as arguments to a function?

The dialog box is refusing to appear as a modal popup - shadcn

JavaScript's prime sleep function

The Vue application is unable to expand to 100% height when using a media query

Exploring Websites Using Javascripts or Online Forms

Learn how to add a variable to a PHP array using a jQuery click event

What is the best method for finding a particular value in a generic List in C#?

What strategies are typically employed to prevent falling into the callback hell trap when working with error-back asynchronous functions in Node.JS?