Primitives

Objectives

• Briefly describe the history of JavaScript and its purpose as a language

• Define JavaScript variables and data structures

• Utilize primitives and operators in order to solve problems using JavaScript

  • Manipulate integers, floating point, and decimal numbers

  • Manipulate strings

  • Use booleans as return values, as variables, and in the context of a conditional

History

Then

• developed by Brendan Eich (for Netscape, now Mozilla)

• 10 days

• went through a few different names before settling on JavaScript (Java was popular)

• taken to ECMA for standardization

Now

• JavaScript is THE front-end language

• clunky, things to complain about, but it works and is web-driven!

• tons of open source libraries

• also used as a backend language, using Node.js

• working on ECMAScript 6

Comments

Comments come in two forms

Line comments

// descriptive stuff

Multi-line comments

/**
  These
  are
  comments on
  many lines
*/

Numbers

Numbers are one of the types of values we want to be able to interact and play with in JS.

Integers

 ..., -1, 0, 2, 3, 4, 5, ...

Floats (or Decimal numbers)

 2.718, 3.14, .5, .25, etc

In JS these are both the same type of object, which it calls Numbers.

This can infrequently cause problems!

0.1 * 0.2 = 0.020000000000000004

How to deal with floating point precision in JavaScript

Exercise

2 + 2 * 3

How would you get the 2 + 2 to execute before the * 3? In other words, how would you change this expression to get 12?

Strings

Strings are collections of letters and symbols known as Characters, and we use them to deal with words and text in Javascript. Strings are just another type of value in Javascript.

"John"
'Jane'

Exercise

You can use operators on strings too! Try typing "John" + "Jane". This is called String concatenation

Tangent: Type coercion

[Type coercion is the process of converting value from one type to another](https://www.freecodecamp.org/news/js-type-coercion-explained-27ba3d9a2839/#:~:text=Type coercion is the process,Symbol (added in ES6).)

Try this...

"1" + 1

Without removing the quotes, how would you get this to equal 2?

Booleans

Booleans are a type that can only have one of two values: true or false.

true
false

Operator Review

+ (add)
- (subtract)
* (multiply)
/ (divide)
% (modulus)

Special Number Operators

Javascript can be a little cheap with the number of operations it allows you to do. For example, how is someone supposed to square a number or cube a number easily? Luckily there is a special Math object with some very useful methods.

• Taking a number to some power? Then just use Math.pow

// 3^2 becomes
Math.pow(3, 2);
// => 9

// 2^4 becomes
Math.pow(2, 4);
// => 16

• Taking a square root

// √(4) becomes
Math.sqrt(4);
// => 2

• Need a random number? Then use Math.random.

// The following only returns a random decimal
Math.random();
// => .229375290430

/**
  The following will return a
  random number between 0 and 10
*/
Math.random() * 10;

• Since Numbers can be Floats or Integers we often want to get rid of remaining decimal places, which can be done using Math.floor.

// Remove the decimal
Math.floor(3.14)
// => 3

Math.floor(3.9999)
// => 3

Variables

Having made some expressions it becomes evident we want to store these values.

let myNumber = 1;
// or also

let myString = "Greetings y'all!";

The main note to make here is that these variables should always have the let keyword and use camelCase. You also may see the var keyword as well from time to time. We will talk more about the difference later.

Objects Everywhere

In Javascript we just discussed two types of values we can use. We call these values objects, which for now just means that in addition to storing some data you also get to use some helpful methods when you are working with them.

In JavaScript, almost everything is an object (primitive types are the exception).

• If you want to turn a number into a string you can use a helpful method called toString.

myNumber.toString()
// => "1"

Common String / Number methods

• Numbers

  • .toString() - converts a number to a string

  • .toFixed(), - converts a number to a fixed string representation

    • More info: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/toFixed

  • parseInt('33') - converts a string to an integer

  • parseFloat('3.1') - converts a string to a floating point number

• Strings

  • .split('') - converts a string into an array split in a provided character

  • .indexOf('s') - returns the index of the first appearance of a provided string

  • .toUpperCase() - converts a string to all caps

  • .toLowerCase() - converts a string to all lowercase

  • .replace('old', 'new') - replaces the first appearance of a string with a new string

Note that most of these functions are called on an object, while functions like parseInt() and parseFloat() only take in arguments.

Reference

Values, variables, and literals

re-introduction to JavaScript

MDN JavaScript documentation