diff --git a/4-modern-js/1-vars.js b/4-modern-js/1-vars.js
new file mode 100644
index 0000000..f988541
--- /dev/null
+++ b/4-modern-js/1-vars.js
@@ -0,0 +1,21 @@
+{
+  // Block Scope
+  {
+    // Nested Block Scope
+  }
+}
+
+if (true) {
+  // Block Scope
+}
+
+for (var i = 1; i <= 10; i++) {
+  // Block Scope
+}
+
+function sum(a, b) {
+  // Function Scope
+  var result = a + b;
+}
+
+sum(4 + 3);
diff --git a/4-modern-js/10-template-strings.js b/4-modern-js/10-template-strings.js
new file mode 100644
index 0000000..d33b69d
--- /dev/null
+++ b/4-modern-js/10-template-strings.js
@@ -0,0 +1,9 @@
+const greeting = "Hello World";
+
+const answer = 'Forty Two';
+
+const html = `
+  <div>
+    ${Math.random()}
+  </div>
+`;
diff --git a/4-modern-js/11-classes.js b/4-modern-js/11-classes.js
new file mode 100644
index 0000000..f9ac89b
--- /dev/null
+++ b/4-modern-js/11-classes.js
@@ -0,0 +1,28 @@
+class Person {
+  constructor(name) {
+    this.name = name;
+  }
+  greet() {
+    console.log(`Hello ${this.name}!`);
+  }
+}
+
+class Student extends Person {
+  constructor(name, level) {
+    super(name);
+    this.level = level;
+  }
+  greet() {
+    console.log(`Hello ${this.name} from ${this.level}`);
+  }
+}
+
+const o1 = new Person("Max");
+const o2 = new Student("Tina", "1st Grade");
+const o3 = new Student("Mary", "2nd Grade");
+
+o3.greet = () => console.log('I am special!');
+
+o1.greet();
+o2.greet();
+o3.greet();
diff --git a/4-modern-js/12-async-await.js b/4-modern-js/12-async-await.js
new file mode 100644
index 0000000..fef3db5
--- /dev/null
+++ b/4-modern-js/12-async-await.js
@@ -0,0 +1,23 @@
+const https = require('https');
+
+function fetch (url) {
+  return new Promise((resolve, reject) => {
+    https.get(url, (res) => {
+      let data = '';
+      res.on('data', (rd) => data = data + rd);
+      res.on('end', () => resolve(data));
+      res.on('error', reject);
+    });
+  });
+}
+
+fetch('https://www.javascript.com/')
+  .then(data => {
+    console.log(data.length);
+  });
+
+  (async function read() {
+    const data = await fetch('https://www.javascript.com/');
+
+    console.log(data.length);
+  })();
diff --git a/4-modern-js/2-const.js b/4-modern-js/2-const.js
new file mode 100644
index 0000000..f0b63da
--- /dev/null
+++ b/4-modern-js/2-const.js
@@ -0,0 +1,10 @@
+// Scalar values
+const answer = 42;
+const greeting = 'Hello';
+
+// Arrays and Objects
+const numbers = [2, 4, 6];
+const person = {
+  firstName: 'John',
+  lastName: 'Doe',
+};
diff --git a/4-modern-js/3-why-const.js b/4-modern-js/3-why-const.js
new file mode 100644
index 0000000..e65dbc9
--- /dev/null
+++ b/4-modern-js/3-why-const.js
@@ -0,0 +1,25 @@
+const answer = 42;
+
+/*
+
+A big program here...
+
+*/
+
+answer // is still 42;
+
+
+
+// vs
+
+
+
+let answer = 42;
+
+/*
+
+A big program here...
+
+*/
+
+answer // might have changed;
diff --git a/4-modern-js/4-functions.js b/4-modern-js/4-functions.js
new file mode 100644
index 0000000..2280fe4
--- /dev/null
+++ b/4-modern-js/4-functions.js
@@ -0,0 +1,9 @@
+const X = function () {
+  // "this" here is the caller of X
+};
+
+const Y = () => {
+  // "this" here is NOT the caller of Y
+
+  // It's the same "this" found in Y's scope
+};
diff --git a/4-modern-js/5-this.js b/4-modern-js/5-this.js
new file mode 100644
index 0000000..0eedfc0
--- /dev/null
+++ b/4-modern-js/5-this.js
@@ -0,0 +1,16 @@
+// "this" here is "exports"
+
+this.id = 'exports';
+
+const testerObj = {
+  func1: function () {
+    console.log('func1', this);
+  },
+
+  func2: () => {
+    console.log('func2', this);
+  },
+};
+
+testerObj.func1();
+testerObj.func2();
diff --git a/4-modern-js/6-arrow-functions.js b/4-modern-js/6-arrow-functions.js
new file mode 100644
index 0000000..aded1ed
--- /dev/null
+++ b/4-modern-js/6-arrow-functions.js
@@ -0,0 +1,8 @@
+const square = (a) => {
+  return a * a;
+};
+
+// const square = (a) => a * a;
+// const square = a => a * a;
+
+[1, 2, 3, 4].map(a => a * a);
diff --git a/4-modern-js/7-objects.js b/4-modern-js/7-objects.js
new file mode 100644
index 0000000..0f92fcc
--- /dev/null
+++ b/4-modern-js/7-objects.js
@@ -0,0 +1,6 @@
+const obj = {
+  p1: 10,
+  p2: 20,
+  f1() {},
+  f2: () => {},
+};
diff --git a/4-modern-js/8-destructuring.js b/4-modern-js/8-destructuring.js
new file mode 100644
index 0000000..354974d
--- /dev/null
+++ b/4-modern-js/8-destructuring.js
@@ -0,0 +1,21 @@
+// const PI = Math.PI;
+// const E = Math.E;
+// const SQRT2 = Math.SQRT2;
+
+const { PI, E, SQRT2 }  = Math;
+
+// With require
+// const { readFile } = require('fs');
+
+
+// const circle = {
+//   label: 'circleX',
+//   radius: 2,
+// };
+//
+// const circleArea = ({ radius }) =>
+//   (PI * radius * radius).toFixed(2);
+//
+// console.log(
+//   circleArea(circle)
+// );
diff --git a/4-modern-js/9-rest-spread.js b/4-modern-js/9-rest-spread.js
new file mode 100644
index 0000000..d61df48
--- /dev/null
+++ b/4-modern-js/9-rest-spread.js
@@ -0,0 +1,16 @@
+const [first, ...restOfItems] = [10, 20, 30, 40];
+
+const data = {
+  temp1: '001',
+  temp2: '002',
+  firstName: 'John',
+  lastName: 'Doe',
+};
+
+const { temp1, temp2, ...person } = data;
+
+const newArray = [...restOfItems];
+
+const newObject = {
+  ...person,
+};