JavaScript: Difference between revisions
Line 28: | Line 28: | ||
console.log(match[1], match[2]); | console.log(match[1], match[2]); | ||
console.table(match); | console.table(match); | ||
===Classes=== | |||
Traditionally, classes are done using functions in JavaScript.<br> | |||
{{hidden | Traditional JS Classes | | |||
<syntaxhighlight lang="javascript"> | |||
function Rectangle(height, width) { | |||
this.height = height; | |||
this.width = width; | |||
} | |||
// To extend some Shape class | |||
Rectangle.prototype = Object.create(Shape.prototype); | |||
// To add to the prototype | |||
Object.assign(Rectangle.prototype, { | |||
getSize: function() { | |||
return this.height * this.width; | |||
} | |||
}); | |||
</syntaxhighlight> | |||
}} | |||
[https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes Mozilla Reference]<br> | |||
ES2015 adds syntax for classes in JavaScript.<br> | |||
<syntaxhighlight lang="javascript"> | |||
class Rectangle extends Shape { | |||
constructor(height, width) { | |||
this.height = height; | |||
this.width = width; | |||
} | |||
getSize() { | |||
return this.height * this.width; | |||
} | |||
} | |||
</syntaxhighlight> | |||
</syntaxhighlight> | </syntaxhighlight> |
Revision as of 15:17, 20 January 2020
This page is a mostly about browser-based JavaScript or ECMAScript usage and interaction with the HTML DOM (window). For server and desktop application JavaScript usage, please see the NodeJS page.
Usage
Arrays
let arr = [1,2,3];
// Map
arr.map(x => x > 2); // [false, false, true]
// Reduce or Fold
// Note that if you do not provide an initial accumulator,
// then the first element will be your accumulator
// I.e. the first call to your function will be (arr[0], arr[1])
arr.reduce((acc, x) => acc + x, 0); // 6
Canvas
Video
Regular Expressions (Regex)
var myRegex = /(\d+),(\d+)/;
var myStr = "124,52";
var match = myStr.match(myRegex);
// Captures
console.log(match[1], match[2]);
console.table(match);
===Classes===
Traditionally, classes are done using functions in JavaScript.<br>
{{hidden | Traditional JS Classes |
<syntaxhighlight lang="javascript">
function Rectangle(height, width) {
this.height = height;
this.width = width;
}
// To extend some Shape class
Rectangle.prototype = Object.create(Shape.prototype);
// To add to the prototype
Object.assign(Rectangle.prototype, {
getSize: function() {
return this.height * this.width;
}
});
}}
Mozilla Reference
ES2015 adds syntax for classes in JavaScript.
class Rectangle extends Shape {
constructor(height, width) {
this.height = height;
this.width = width;
}
getSize() {
return this.height * this.width;<br />
}
}
</syntaxhighlight>