JavaScript: Difference between revisions
Line 13: | Line 13: | ||
The introduction of highly interactive "web apps" like Google Maps has helped to reduce some of the differences between browsers in their implementation of JavaScript (which made early JavaScript development quite a nightmare). Traditionally popular JavaScript frameworks like prototype and [[JQuery]] have helped to smooth over differences between browsers and led to many techniques (such as using CSS selectors in Javascript code, and "functional" style programming) more popular and better incoporated into "vanilla" javascript. | The introduction of highly interactive "web apps" like Google Maps has helped to reduce some of the differences between browsers in their implementation of JavaScript (which made early JavaScript development quite a nightmare). Traditionally popular JavaScript frameworks like prototype and [[JQuery]] have helped to smooth over differences between browsers and led to many techniques (such as using CSS selectors in Javascript code, and "functional" style programming) more popular and better incoporated into "vanilla" javascript. | ||
'''Node''' (2009) is an implementation of javascript designed to run '''outside of the browser''' aka '''server-side'''. Together with its related package manager '''npm''', Node has made a huge impact on the ecosystem of javascript development and '''npm''' serves as a foundation for all kinds of javascript development workflows (whether or not the final "target" of a project is node/ | '''Node''' (2009) is an implementation of javascript designed to run '''outside of the browser''' aka '''server-side'''. Together with its related package manager '''npm''', Node has made a huge impact on the ecosystem of javascript development and '''npm''' serves as a foundation for all kinds of javascript development workflows (whether or not the final "target" of a project is a (node) server and/or in the browser). | ||
In 2021, javascript is a vibrant but complex development ecosystem. | In 2021, javascript is a vibrant but complex development ecosystem. |
Revision as of 11:06, 16 February 2021
Scripting language built into web browsers.
Links
- Nice blog post from 2020 on what simple modern javascript in a browser can do: https://jvns.ca/blog/2020/06/19/a-little-bit-of-plain-javascript-can-do-a-lot/
- See also JQuery
History
Originally designed for the Netscape browser, the name "JavaScript" was chosen to associate with the "Java" programming language developed by Sun which, in 1995, was the first real option for making "live" code run over the web. Other than the name, there is no relation between JavaScript and Java. The formal name for JavaScript now is ECMAScript, but as this sounds more like a skin condition than a programming language, the name JavaScript has persisted.
The introduction of highly interactive "web apps" like Google Maps has helped to reduce some of the differences between browsers in their implementation of JavaScript (which made early JavaScript development quite a nightmare). Traditionally popular JavaScript frameworks like prototype and JQuery have helped to smooth over differences between browsers and led to many techniques (such as using CSS selectors in Javascript code, and "functional" style programming) more popular and better incoporated into "vanilla" javascript.
Node (2009) is an implementation of javascript designed to run outside of the browser aka server-side. Together with its related package manager npm, Node has made a huge impact on the ecosystem of javascript development and npm serves as a foundation for all kinds of javascript development workflows (whether or not the final "target" of a project is a (node) server and/or in the browser).
In 2021, javascript is a vibrant but complex development ecosystem.
Data types
Variables
Functions
def hello (x):
print "Hello", x
hello("Bob")
function hello (x) {
console.log("Hello", x);
}
hello("Bob");
Loops
words = "Once upon a time, in a galaxy far far away".split()
for w in words:
print w
var words = "Once upon a time, in a galaxy far far away".split(" ")
for (var i=0; i<words.length; i++) {
console.log(words[i]);
}
Promises & Asynchronous programming
Array methods: forEach() & map()
const array1 = ['a', 'b', 'c'];
array1.forEach(element => console.log(element));
// expected output: "a"
// expected output: "b"
// expected output: "c"
See: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach
Fetch API & making HTTP requests
https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API
From Python
- Curly braces ({}) instead of colons and indentation (:)
- Indentation: still important for readability!
- Semi-colons at ends of lines (though optional, good to get into the practice of using)
- "var", "let" and "const" to announce a variable (technically optional but important to be explicit about scope)
- "function" defines functions, also the new "splat" style ( => )
- Implicit type conversion ("hello" + 7 = "hello7")
Resources
"Core" Documentation from mozilla.org
Online Tutorials