About eloquent javascript.

This commit is contained in:
Linus Miller 2016-03-20 10:16:17 +01:00
parent 2b75c268a8
commit 1623abe03e
3 changed files with 242 additions and 1 deletions

217
javascript/functions.md Normal file
View File

@ -0,0 +1,217 @@
# Functions
## Definition
There are two ways to define a function, either by assigning it to
Creating a named function:
```
function testicle() {
console.log('poo far');
}
console.log(testicle.name); // testicle
```
if you omit the name, you create an 'anonymous' function. Unless you
immediately invoke it or assign it to a variable you will not be able to refer
to it again.
Assigning to variable:
```
var testicle = function () {
console.log('poo far');
}
console.log(testicle.name)// '' (empty string)
```
Assigning to a variable does not give a name to the function.
```
var testicle = function () {
console.log('poo far');
};
```
// TODO fix wording
This means a function can have different name from variable. However, you
cannot call it by it's name. TODO Why can you not call it by its name now?
```
var testicle = function penis() {
console.log('poo bar');
};
console.log(testicle.name)// 'penis';
testicle();// 'poo bar'
penis();// ReferenceError
```
The following does work, Though I do not know why you would want to.
```
function penis() {
console.log('poo bar');
};
var testicle = penis;
console.log(testicle.name)// 'penis';
testicle();// 'poo bar'
penis();// 'poo bar'
```
(This rest of this section is copied from <http://stackoverflow.com/a/336868>).
The difference is that `functionOne` is defined at run-time, whereas `functionTwo`
is defined at parse-time for a script block. For example:
```
<script>
// Error
functionOne();
var functionOne = function() {
};
</script>
<script>
// No error
functionTwo();
function functionTwo() {
}
</script>
```
This also means you can't conditionally define functions using the second
syntax:
```
<script>
if (test) {
// Error or misbehavior
function functionThree() { doSomething(); }
}
</script>
```
The above actually defines functionThree irrespective of test's value — unless use strict is in effect, in which case it simply raises an error.
## Lexical Scoping
JavaScript is lexically scoped, but only function blocks create a new scope
(not if or for blocks for example).
Since functions can be nested inside each other, several degrees of locality
can be created. Each local scope can see all scopes which contains it.
```
function() {
var testicle = 'one ball';
}
console.log(testicle); // ReferenceError
```
```
if(true) {
var testicle = 'one ball';
}
console.log(testicle); // 'one ball'
```
## IIFE (Immediately Invoked Function Express)
IIFEs are functions that are immediately invoked and are mostly used to create
scopes.
```
(function() {
var secretTesticle = 'another ball';
console.log(secretTesticle);
})();
```
Notice the brackets at the end. The following snippet (which does exactly the same
thing) might be a little clearer:
```
var fnc = function() {
var secretTesticle = 'another ball';
console.log(secretTesticle);
}
fnc();
```
## Parameters & Arguments
First off, a __parameter__ is a variable that is part of a functions signature (function declaration), while
an __argument__ is an actual value passed to a function when calling it (think "actual argument" vs "formal parameter").
In JavaScript, a function does not need to have any parameters defined to allowing passing arguments to it.
All arguments passed to a function are accessible through the special `arguments` array-like variable inside
the function body.
```
function hasParameters(poo, far, and, succeed) {
console.log(poo);
console.log(far);
console.log(and);
console.log(succeed);
console.log(arguments[0]);
console.log(arguments[1]);
console.log(arguments[2]);
console.log(arguments[3]);
}
function lacksParameters() {
console.log(arguments[0]);
console.log(arguments[1]);
console.log(arguments[2]);
console.log(arguments[3]);
}
hasParameters(1, 2, 3);// 1 2 3 undefined 1 2 3 undefined
lacksParameters(1, 2, 3);// 1 2 3 undefined 1 2 3 undefined
## `this`
```
var obj = {
fnc: function() {
console.log(this === obj);
console.log(this === window);
}
};
var fnc = obj.fnc;
obj.fnc();// true false
fnc();// false true
```
## Function.prototype.bind
## Function.prototype.call & Function.prototype.apply
```
function org() {
console.log('testicle');
}
function ext() {
// do something
org.apply(this, arguments);
}
```

View File

@ -1,9 +1,15 @@
# Introduction # Introduction
Bra bok (tror jag): Free, good online Book:
+ <http://eloquentjavascript.net/> + <http://eloquentjavascript.net/>
If you are an experienced programmer, a quick guide to JavaScript is the following:
1. JavaScript is loosely-typed, and variables are defined with the `var`
keyword. ES6/ES2015 introduces the `const` and `let` keywords.
2. Functions are first-class objects, meaning they can be saved to variables.
Bra generellt: Bra generellt:
+ <http://bonsaiden.github.io/JavaScript-Garden/> + <http://bonsaiden.github.io/JavaScript-Garden/>

18
javascript/variables.md Normal file
View File

@ -0,0 +1,18 @@
# Variables
## Hoisting
```
console.log(poo);// undefined
var poo = 'far';
console.log(poo);// 'far'
```
```
console.log(poo);// undefined
console.log(far);// ReferenceError
var poo = 'far';
```