Skip to content

Instantly share code, notes, and snippets.

@nataliemok
Last active July 27, 2017 02:27
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save nataliemok/ac1c0e4eaa2a02ab247fae1c69c31ee5 to your computer and use it in GitHub Desktop.
Save nataliemok/ac1c0e4eaa2a02ab247fae1c69c31ee5 to your computer and use it in GitHub Desktop.

In JavaScript, you've learned about Objects already. Object have properties, which can reference objects or primitives.

In this reading, we'll be focusing on JavaScript primitive data types. You can consider primitives as values. In JavaScript, there are 5 primitive data types: undefined, null, boolean, string, and number. Everything that is not a primitive data type is an object. Each primitive has a corresponding object constructor; you can see this clearly in this example:

typeof(true); //"boolean"
typeof(Boolean(true)); //"boolean"
typeof(new Boolean(true)); //"object"

An object contructor can be invoked with the word new, as seen above. Each object has methods associated with them based on what constructor was used. One interesting thing to note is that primitive data types do not have properties. Something you may be asking, is then why does "someString".length return a value? Let's take you back to the behaviour of == vs ===. When you use ==, JavaScript does this fun thing called type coercion. This means that Javascript will take different data types, and one of them will be converted to an "equivalent". A good example of this is:

'1' == 1;
// => true
'1' === 1;
// => false

In the case of "someString".length", "someString" is coerced to a string object in order to access the property length; and then back again to the primitive string.

// some examples of String properties:
var str = "someString";

console.log(str.toUppercase);
// => SOMESTRING

console.log(str.toLowercase);
// => somestring

console.log(str.split(""));
// => [ 's', 'o', 'm', 'e', 'S', 't', 'r', 'i', 'n', 'g']

console.log(str.split());
// => ['someString']

You can actually test the difference between the constructor and actual primitive. Here we can see that the == (type-coercion vulnerable) comparative returns true, while the === comparative returns false.

var word = "Hello, world!"
var otherWord = new String("Hello, world!");
word == otherWord; 
// => true
word === otherWord;
// => false
@jholman
Copy link

jholman commented Jul 27, 2017

So far, we've worked with many different types of values in JavaScript. We've worked with Numbers and Strings and Booleans, we've seen Undefined, and maybe we've seen Null. And now we've been introduced to Objects (and Arrays and of course Functions, both of which are a technically a sub-category of Objects). Objects (including Arrays and Functions and other types of Objects) have properties.

In JavaScript, all values which are not Objects are collectively referred to as primitives. Let's review the six types of primitives:

  • Number
  • String
  • Boolean
  • undefined
  • null
  • Symbol (this one is new-ish, from the ES2015 version of JavaScript)

Anything not in that list (for example, a Date) is an Object. Those six primitive types, plus Object, make up the seven fundamental types of JavaScript.

The preceding part of this reading you should be able to remember. The upcoming part is mostly an interesting technicality.

As it turns out, in JavaScript, primitive values do not have properties. At first when you read this, you might not notice what's surprising about this. "So what?", you say. Well, if a property is that thing you can access like object.property, and if primitive values don't have properties, and a string is a primitive value.... then what's the h*ckin' deal with someString.length or someNumber.toString()? I'm glad you asked!

Each primitive (excluding Symbol, which is new and has weird rules) has a corresponding object constructor; you can see this clearly in this example:

.... continue from Natalie's example and the rest of her post (ideally the fixed version, not reflected in this gist as of my current posting) ...

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment