This will change no doubt. Here's where we might be right now.
Use document.querySelector and document.querySelectorAll instead of jquery.
// always returns an array
function $(selector) {
return document.querySelectorAll(selector);
}
Don't need type='text/javascript' in a script tag.
var is deprecated. Use const and/or let
For a value that should never be changed use const , e.g.
const numWheels = 4;
For a value that can be changed, use let
let age = 0;
Instead of this:
const width = dims.width;
const height = dims.height;
You can write:
const {width, height} = dims;
instead of
const width = 300;
const height = 150;
const obj = {
width: width,
height: height,
area: function() {
return this.width * this.height
},
};
you can simplify slightly:
const width = 300;
const height = 150;
const obj = {
width,
height,
area() {
return this.width * this.height
},
};
var middle = [3, 4];
var arr = [1, 2, ...middle, 5, 6];
console.log(arr);
// [1, 2, 3, 4, 5, 6]
var arr = [2, 4, 8, 6, 0];
var max = Math.max(...arr);
console.log(max);
// 8
class Rectangle {
constructor(height, width) {
this.height = height;
this.width = width;
}
// Getter
get area() {
return this.calcArea();
}
// Method
calcArea() {
return this.height * this.width;
}
}
Instead of
thing.calc(function(value){
return value + 2;
});
Use:
loader.load(value => {
return value + 2;
});
Or even:
loader.load(value => value + 2);
In classic function expressions, the this keyword is bound based on the context in which it is called. With arrow functions however ... it uses this from the code that contains the arrow function.
—Cynthia Lee: When (and why) you should use ES6 arrow functions — and when you shouldn't
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Using_promises
https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Asynchronous/Async_await