The function toUpperCase cannot be used on myArray[items]

Upon running the code snippet below:

<script>

    var name = "Hello moorthi";
    var myArray = name.split(' ');

    setTimeout(function(){
      var nameDisplay='';
      try {
        for (var names in myArray){

          nameDisplay += myArray[names].toUpperCase()+' ';
        }
        alert(nameDisplay);
      }
      catch(err){
        console.log(err.message);
      }
    },
    1000);

 </script>

An error message stating 'undefined is not a function' appears in Chrome. Can anyone provide insight into why this issue is occurring?

Answer №1

There is no certain guarantee that the order of elements in the array will be maintained with this approach. A more reliable solution would involve utilizing a for loop (for both efficiency and maintaining order):

for (let i = 0, length = myArray.length; i < length; i++){
    message += myArray[i].toUpperCase() + ' ';
}

Answer №2

Implement

updatedMsg = myArray.map((item) => return item.toUpperCase()).join(' ');

Avoid using for/in loops without verifying with hasOwnProperty.

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

Preserve jQuery-enhanced webpage changes permanently

I am looking to permanently save modifications made on an HTML page using JQuery. I have come across suggestions about achieving this by sending an Ajax call and storing the data in a database table. However, I am unsure about what exactly needs to be save ...

Transferring information in Laravel with the help of Axios and Vue Framework

While following the Laracasts tutorial on integrating Stripe, I noticed that a lot has changed since the release of Laravel 5.4. Although I managed to navigate through most of it, I encountered an issue when trying to submit a payment form using Vue and Ax ...

I am experiencing issues with jquery functionality in my PHP file

I attempted to create a show-hide div using jQuery and ran into an issue. It was functioning properly with HTML, but when I converted it to PHP, the click event stopped working! While working on my college project, I tried to show and hide a div using jQu ...

Angularjs Error Message: Syntax Parsing Issue

Being new to AngularJS, I am trying to grasp the error messages displayed in the console. Below are my JSON object and other details for reference. In the JSP page: <body id="bodyID" ng-controller="ApplicationParameterController" > <div ng-c ...

Incorporating library files (css/js) into your app built on the angular-fullstack framework

After using a Yo Angular-Fullstack generator (https://github.com/DaftMonk/generator-angular-fullstack) to start an app, I attempted to install Toastr from bower with the command: bower install angular-toastr Now, I need to add the toastr css and js files ...

What is preventing me from "importing" react-dom.js?

Implementing ReactDOM into my Jest tests has been a bit of a challenge. Let's take a look at the code snippet below. const React = require('../src/js/vendor/react/build/react.js'); const ReactDOM = require('../src/js/vendor/react/build ...

ESLint is not performing linting even though the server is operational

I found a frontend template online and successfully installed all the packages using yarn. However, although I have an .eslint.json file in place and the ESLint extension is installed in Visual Studio Code, I am not seeing any linting errors. Below is the ...

Guide to successfully integrate MathJax into your React application

I developed an application using HTML that successfully rendered MathJax equations through a script tag. However, after transitioning to React, the MathJax equations are no longer appearing. I have tried adding the MathJax script (shown below) in the comp ...

What is the method to achieve a full-width image when utilizing vertical scrollspy within Bootstrap?

Seeking a unique responsive webpage design utilizing Bootstrap. I envision a vertical scrollspy on the left paired with parallax scrolling on the right, akin to this example. Here's my current code snippet: <!DOCTYPE html> <html> <he ...

Each time I attempt to navigate to a different component by clicking on a button, I have experimented with using Link and Routes in React, but have been unsuccessful in

After clicking on a button following the first h1 tag, I want to open the AddProjects Component. However, despite using react-router-dom, an error keeps showing up. I think I might be using it incorrectly. Please help me correct it. import React from " ...

Error message malfunction on the Express.js server side

Here is the server-side POST code that I am using. Before saving my task to the database, I am trying to find data in the database using a unique value called service. However, when I run this code, the console displays an error: ReferenceError: service is ...

Troubleshooting the issue with reactdom.render() functionality in CodeSandbox

Having issues with ReactDom in CodeSandbox for React. The HTML file includes: <body> <div id="root"></div> </body> <script src="scr/index.js"> The JavaScript file (named index) includes: ReactDOM.rende ...

Get Angular events in the proper order

I am currently facing challenges with event handling in AngularJs. In my service, I send out events using the following line of code : $rootScope.$emit("FNH."+this.status, flowNodeHelper); When receiving the event in service "S1," I handle it as follows ...

Use JavaScript regex to replace a string only if its length exceeds a certain specified limit

My current approach involves using JavaScript regex to insert an HTML markup for all identified URLs: var exp = /(((|www\.|(http|https|ftp|news|file)+\:\/\/)[&#95;.a-z0-9-]+\.[a-z0-9\/&#95;:@=.+?,##%&~-]*[^.|&bso ...

Maximizing the potential of a cell in a table

I am currently using AJAX to retrieve and display data in my table. However, I want to capture the actual value from the selected cell in the table. To better display user needs, I have split the returned value to obtain specific items. Below is the scri ...

Problems encountered with nested AJAX calls and the $.when.apply function handling deferred promises efficiently

I am attempting to create a triple nested series of AJAX calls, as shown in the basic structure below (fail calls have been omitted). Progress is being made up to the second level with the eventCalls. The final when.apply.done only triggers after every si ...

Stop the scrolling behavior from passing from one element to the window

I am facing an issue with a modal box window that contains an iframe. Inside the iframe, there is a scrollable div element. Whenever I try to scroll the inner div of the iframe and it reaches either the top or bottom limit, the browser window itself start ...

Stylish CSS Tricks with Font Awesome Icons

In my project, I am utilizing Font Awesome SVG with JavaScript multiple times. Currently, I am working on creating a button that displays an arrow icon to the right of the text when hovered over. However, I encountered an issue where there is a blank squar ...

Vue.js HTML5 Editor_vueful

I am currently utilizing browserify and attempting to incorporate the vue-html5-editor library from https://github.com/PeakTai/vue-html5-editor. However, when I attempt the following code: Vue.use(require('vue-html5-editor')); An error is thro ...

Angular module now equipped with web worker for independent operation

My goal is to create a standalone AngularJS module that utilizes web workers for handling heavier processing tasks. This module will be integrated into an Angular web application that I am currently developing, as well as potentially other projects. I env ...