es2015.md

title	permalink
ES2015	/es2015

ES2015 Lesson

ES2015 or ES6 is the latest version of javascript. It was released in 2015 and it's previous version, the one you have been using until now, was released in 2007 (no wonder it's outdated, could computers even do stuff then). Even though ECMAScript 2015 cannot yet run by itself in ALL browsers (cough cough, InternetExplorer... that's why no one likes you bc you never stay updated), we can use tools like Babel to compile the new ES2015 fancy javascript we write to plain old 2007 javascript. Babel even provides a cool test area where you can practice writing new ES2015 javascript and it will show you how it turns it into old javascript. Babel Test Area

Assignment: Read Intro on New Features

Here is a good article that outlines the new features of ES2015 or ES6. It gives you a couple code comparisons so you can see how syntax has changed (to hopefully make things easier to code, less verbose and provide additional functionalities).

Medium Article - An Intro to ES6

Assignment: Take Course

Yeah back to CodeSchool. They have a course on this:

CodeSchool - ES2015 Course

Assignment: Practice ES2015 Syntax

Remember that class list demo we did in class... To demonstrate "Object-Oriented" Javascript programming, we quickly coded a Student class. Then used that student class to list organize and list out all the students in a class. You can see where we left off:

function Student(name, major, email, avgGpa, courses){
  this.name = name;
  this.major = major,
  this.email = email;
  this.avgGpa = avgGpa;
  this.courses = courses;
}

Student.prototype = {
  addCourse: function(course){
    this.courses.push(course);
    return this.courses;
  },

  removeCourse: function(course){
    for(var i = 0; i<this.courses.length; i++){
      if(this.courses[i] == course){
        this.courses.splice(i, 1);
      }
    }
  },

  changeMajor: function(newMajor){
    this.major = newMajor;
  }
}

Do: Now you are going to "re-code" this student class with the new ES2015 syntax you learned in the CodeSchool Course. One Problem... modern browsers can't read ES2015 yet... so you need a special compiler to pre-compile the code into normal JS so the browser can read it. So let's use Babel test environment to do it: Babel. So Code the New Student class on left side and you can see what it compiles to in normal Javascript on the right.

Okay Let's move on to React.