Skip to main content

Checking if string is numeric in Typescript and Javascript

I came across a problem of converting a char value to a number when I was working with Javascript. The interesting thing was that the solution just wasn’t as obvious as I initially thought. In this post, I will talk about how I solved the problem and why did I come across it in the first place.

Background

In a previous post, I mentioned how I was solving a bunch of recursive problems on CodingBat.com! Well…I had a bit too much fun with it and I decided to extend the fun by solving string problems as well. Solving the string problems was good easy fun, until I came across a minor issue.

Issue

The problem I was trying to solve was sumDigits. It’s a simple problem i.e.
As I mentioned in my previous post and as you can see, CodingBat is focused on Java. However, the problem description is fairly generic and can be solved in any language.
When writing the code for this problem the first thing that I thought of was Math.abs. For anyone who’s worked with Javascript would know this method. Unfortunately it’s been a while since I solved something like this in Javascript, so the first line of code I wrote for it didn’t work. How?

Like the blog? Subscribe for updates

Solution

Here’s a small snippet of what I was trying to do,
if(Math.abs(str.charAt(0)) != NaN) { }
That clearly didn’t work. Initially, I was trying to solve this in Typescript and I didn’t know of the Number.parseInt method introduced in ES6. As soon as I got to know about that method then it was super easy. Here’s my solution in Typescript.
sumDigits(str: string): number {
    if(str.length == 0) {
        return 0;
    }
    var sum = 0;
    let charArray = str.split("");
    charArray.forEach((val) => {
        let num = parseInt(val);
        if(!isNaN(num)) {
            sum += num;
        }
    });
    return sum;
}
The solution should be fairly self-explanatory but let me describe it. The problem is, we are trying to find out the numeric values in a string and return a sum of all of them. So, we call the split method on the string and a split method with an empty string will return an array of characters. Then again, we use an ES6 method to traverse the array i.e. forEach and if the character is a number we add it to our sum. I think, the only things typescript specific in the above function is the type (i.e. string and number) information. The rest of the code is just plain ES6 Javascript.
p.s. Having types in Javascript is so awesome, thank you MS for Typescript 🙂

Any other way to solve this?

Yes of course. Hence let’s look at a slightly more old-fashioned way of solving this and this time we will solve it in pure Javascript.
CBatSolutions.prototype.sumDigits = function(str) {
    if(str.length == 0) {
        return 0;
    }
    var sum = 0;
    let characterArr = str.split("");
    for(var i=0; i < characterArr.length; i++) {
        var absVal = Math.abs(characterArr[i]);
        if(!Number.isNaN(absVal)) {
            sum += absVal;
        }
    }
    return sum;
}
The difference in this solution is we are using an old for loop where we iterate through every character in an array. (besides being in Javascript and not Typescript).

Like the blog? Subscribe for updates

Any other solution?

Well, yes of course. Why not? We can solve this entire problem recursively. The recursive implementation is actually quite straight forward and clean looking.
CBatSolutions.prototype.sumDigitsR = function(str) {
    if(str.length == 0) {
        return 0;
    }
    var absVal = Math.abs(str.charAt(0));
    if(!Number.isNaN(absVal)) {
        return absVal + this.sumDigitsR(str.substring(1));
    } else {
        return this.sumDigitsR(str.substring(1));
    }
}

Summary

For someone like me who’s been working with Javascript since 2008, it’s great to see some of the ES6 changes 🙂 Long live Javascript!
As usual, if you find any of my posts useful support us by  buying or even trying one of our products and leave us a review on the app store.
‎My Day To-Do - Smart Task List
‎My Day To-Do Lite - Task list
DEVELOPER: Bhuman Soni
PRICE: Free+ 
‎Snap! I was there
DEVELOPER: Bhuman Soni
PRICE: $3.99 
Numbers Game: Calculation Master
‎Simple 'N' Easy Task List
DEVELOPER: Bhuman Soni
PRICE: Free
‎Captain's Personal Log
DEVELOPER: Bhuman Soni
PRICE: $4.99
My Simple Notes
DEVELOPER: Bhuman Soni
PRICE: Free 
‎My Simple Notes - Dictate
DEVELOPER: Bhuman Soni
PRICE: $2.99

Comments

Jayen said…
how about this?

```
const sumDigits = str => str.split("").reduce((acc, s) => {
const n = Number(s);
return acc + (n ? n : 0);
}, 0);
```
Jayen said…
ah no, this one is better:

const sumDigits = str => str.split("").reduce((acc, s) => acc + (Number(s) || 0), 0);

Popular posts from this blog

Upload to AWS S3 from Java API

In this post, you will see code samples for how to upload a file to AWS S3 bucket from a Java Spring Boot app. The code you will see here is from one of my open-source repositories on Github, called document-sharing. Problem Let’s say you are building a document sharing app where you allow your users to upload the file to a public cloud solution. Now, let’s say you are building the API for your app with Spring Boot and you are using AWS S3 as your public cloud solution. How would you do that? This blog post contains the code that can help you achieve that. Read more below,  Upload to AWS S3 bucket from Java Spring Boot app - My Day To-Do (mydaytodo.com)

App update, discovering Protractor(testing) and an Angularjs State machine

So for the last couple of weeks, I have not be able to update my blog or finish a couple of the posts that I started writing. Well, I have...been a bit busy, with some the following things,  Testing my app I have been using the app( iOS ) on my iPhone for the past couple of months now, which is both good and bad. The good thing is I can test it and the bad thing is, I can use it every day. Part of the reason, I started building this app is to have something that I can and like to use everyday and since I am already using it, the incentive to release it is not as high as if it were something that I could not use. Anyway I did make some good progress over the last couple of weeks, like  Delete the app from my iPhone and do a clean install: this did help me find a few simple bugs that would pop-up when the app is first installed GET AN APP ICON, FINALLY! this was a bit of a hurdle and I thanks to Fiverr  and fivercrazyguy , I finally have my app icon. The day job ...

Why can't I cancel a local notification in my iOS app?(in Swift)

Prelude I have mentioned the fact that I am working on my first iOS app in a number of my previous posts and as such I face a number of newbie/noob(?) problems. They are not really problems as much as they are simply things that I do not know, for e.g. the following, how do I get the day of the week? where is my string.replaceAll in Swift? knowing which local notification brought my app to foreground ? serving HTML content in an iOS app that works on iOS 7 and above Thankfully, I have managed to make at least one generic solution and contribute it to the community i.e. my open-source Xcode project template( HTML5StarterAppWithSwift ) which you can get from Github . So this post basically describes another very simple problem that I have found a solution to, but I do not fully understand why the problem was occurring in the first place. Introduction As I have mentioned in this post , my iOS app uses local notifications i.e. UILocalNotification   and i...