Question on typeof operator when adding datatypes

Hi guys,

Im pretty new to coding and codecademy but enjoying it so far! On the full stack course and just on the end of the javascript syntax part 1 / module 2 on variables.

Pretty confident now with what i have learnt but not sure about the typeof operator. I understand how it works etc but if declare a new variable which adds two variables of differing types will it default to one or the other? Or is there some other magic going on?

Below i’ve added a number and text type under a new variable. Then when calling the typeof it says string.

Hope that makes sense and i’ve added the code as a codebyte? is that right?

Sure i’ll be on alot so looking forward to talking to some of you soon!

let text = "hello";

let number = "1"

let test = number+text;

console.log(test); //output: 1hello

console.log(typeof test); //output: string

Very good question! Types are a super important concept in programming and you are obviously thinking about them in some depth.

In reality, you can only add together data of the same type, so what JavaScript is doing under the hood is “type coercion”. So when you add the number 1 and the string “hello”, the JS interpreter actually converts the number 1 into the string "1" first.

In any case, you did the right thing by actually writing out the exploratory code and checking the results for yourself.

if declare a new variable which adds two variables of differing types will it default to one or the other? Or is there some other magic going on?

In this case the addition operator is getting “string” and “string” and returning a “string”. Different functions can have different behaviors, some function may take an array and return an integer (e.g. Array.prototype.length()). So the return type of a function just depends on the function signature. In dynamic languages like JavaScript, there is very often implicit type coercion to make things work like you would expect (or often times in JS, in ways that make you say WTF).

There’s a well known funny video about this, I’m not gonna look it up right now, but if you’re interested PM me and I’ll find it.

.length is not a function. It is a property.

Bunk.

Your code is adding a string to a string (concatenating) which means there is some misunderstanding of what type means.

The exercise asks us to try adding two values of differing type. In so doing we get to see how JS resolves the type conflict. The most common outcome will be ‘string’.

1 + 'string'  =>  '1string'

1 + '1'       =>  '11'

[] + 1        =>  '1'

In the case of a boolean, it gets treated as a number…

true + 1       =>  2

false + 1      =>  1

An object cannot be concatenated so we get,

{} + 1         =>  '[object Object]1'

Notice it is a string type.

JavaScript is loosely typed which means there will be no errors thrown when we attempt to perform an operation where the operands are two different types. The outcome may not be what is desired, or expected which makes it doubly important that the programmer keep a tight rein on data types in operations. We should not leverage JS’s ability to coerce one type to another as this is a sure way to disaster.

Learn the types, and especially learn how to manage them.

Yea, I was trying to think of an example quickly. In Python you have the len() function. Anyway, there are functions that can take an array and return an int, or take an number of different types and return some other type.

And that is meaningful, how?

Because you can think of the addition operator as a function that takes two arguments and returns one. The question was “is it magic or some default type?” Well, it depends on the signature/implementation of the function.

Here’s the video I was thinking of, it’s short, funny and illustrates the point about WTF type coercion really well. For example, in JS an empty array plus an empty array equaling an empty string:

https://www.destroyallsoftware.com/talks/wat

Not if you don’t know what a function is, you can’t. Be mindful of the language you use when answering beginners’ questions.

Hi Guys,

Thank you for the advice, much appreciated. Wasn’t to sure how it was working but had an idea. Just needed to type it out and wanted to check.

Thanks all again :ok_hand:

1 Like