Javascript: My Next Language

I started learning Javascript a couple weeks ago, in short early morning sprints before breakfast, 4 or 5 times a week. My goal is to learn vue.js, as a way to create Progressive Web Apps (PWAs).

I knew some things about Javascript when I started learning Javascript. Javascript treats functions as first class objects, which means that Javascript allows functions to be stored in variables, passed as parameters or returned, or modified on the fly, just like objects or arrays.

Object Oriented Programming (OOP) focuses on functions and objects. When I saw a Udemy course “Object Oriented Programming in Javascript”, I decided that would be a great place to start learning Javascript.

Let’s start with what bits I learned, following the pattern in Your Next Language.

Obvious

Unexpected discovery

"use strict";

Similar to Perl’s use strict; , this line puts your ECMAScript 2015 compliant Javascript engine into a “sane” version of Javascript that is much safer to write code in. Mozilla has details.

Put this line at the top of files of new code in Javascript, or at the top of new functions in existing Javascript files.

Don’t put it at the top of an existing Javascript file, unless you have really great tests, or lots of time to fix all the errors, and to manually check all the customer visible interactions.

Blocks

Surrounded by braces: {code block}

• Loops and Decisions:
  Loop over a list:

for (let variable in listname) { }

Functions

(at least?) two ways to declare functions:

function FuncName(optionalParam1, optionalParam2) {
  // do stuff
}

let foo = function() {
  // do stuff
}

Comments: line and block

// one line comment
console.log('hello'); // inline at end of line of code

/*
  block comments
*/

Variables

Old var keyword – don’t use:

var myVar; // do not use var!!

New keywords: let, const:

let myVar;
const myConstant; // the const is unchangeable, but not things inside it

Variable types:

The following is working code.

"use strict";

let myNum = 9; // number
const bookmark = 'Page 9'; // string - defined as a constant
let isDoorClosed = true; // boolean
let authors = ['Heinlein', 'Shakespear', 'Rowling']; // array
let allNight = { // object
  upLate: true,
  topicStudied: 'Belinda'
}

console.log('myNum ' + myNum);
console.log('bookmark ' + bookmark);
console.log('isDoorClosed ' + isDoorClosed);
console.log('Authors:\n' + authors);
console.log('\nobject: ');
for (let item in allNight) {
  console.log(item, allNight[item]);
}

Consider using object syntax where you would use a hash. Some hash methods won’t be available with this simple technique. There are libraries that provide full HashTable functionality.

This sample also demonstrates a for loop.

Passing variables by value, by reference

Value types, also called primitive types:
Symbol, Number, Boolean, String, undefined, null.

Reference types:
Functions, Objects, Arrays.

When you copy a primitive, you copy the value.

When you copy an object, you copy the reference to it.

When you call a function with an item as a parameter, the item is copied.

If it is a primitive, you are looking at a copy in the function.

If it is an object, you are looking at a copy of the reference in the function, but the object referred to is the same object, so when you change the object, you are changing the original.

Using the public package repository, and package manager

I can only say generalizations here, so far.

Node.js has a package manager, npm, for use in your development environment, and on servers. There are others.

Using packages in the browser means collecting them with npm, or other package manager.

Reducing page startup time is apparently a big problem, so there are tools to compress packages for download to the browser, and even break them up so code is only downloaded when you click on the button that needs it.

Breaking long lines into readable pieces

I haven’t investigated that yet.

Finally

This has, for me, been a huge post that took a lot of time in my vacation. I will post more about my current knowledge in Javascript soon.

As usual, writing about this material means I have learned it more thoroughly, and I have had fun doing this!

Let me know in the comments where I have got it wrong. And try out what you see!

 

SOURCE: https://codeburst.io/javascript-my-next-language-27a9678209d4

Written by