javascript

By Value v.s. By Reference

2018 年 6 月 22 日
JavaScript

by value (primitive type)

copying the value into two separate spots in memory

by reference (all objects)

no copy of object is created, instead, two names or more point to same address

var a = { greeting: 'hello', };

var b = a;

a.greeting = 'hola';

b.greeting === 'hola'; //true

/* set up a new memory space and point b to if */

b = { greeting: '你好' };

a.greeting != b.greeting; //true

Function in JavaScript

2018 年 6 月 21 日
JavaScript

JavaScript functions are objects that has other special properties:

Name: optional, can be anonymous
Code: invokable, you can RUN these code by ()

Function statement

Create a object with NAME attribute and point to memory in the creation of execution context

Function expression (anonymous)

Create a object without NAME(already have a variable knows where this object lives) attribute and point to memory in the creation of execution context, and assign this object to function when this line of code is execute

Immediately Invoked Function Expressions (IIFE)

Create the function object on the fly and invoke it immediately, and assign what it return to the variable.

Why use iife and why it is safe

Code wrapped in IIFE does not interfere with, crash into, or be interfered by any other code included in the application.

Methods

In one function’s execution context, we have 1. Variable Environment 2. Outer Environment 3. “this”.

Q: How to control “this” variable?

JavaScript functions also has these methods(can control “this”):

call()
apply()
bind()

Functional Programming

We should think and code in terms of functions

Type in JavaScript

2018 年 6 月 3 日
JavaScript

primitive value

undefined
null
boolean
number (only one number type…)
string
symbol (ES6)

coercion

var a = 1 + '2';

console.log(a); // 12

/* JavaScript engine coerce 1 into string (dynamic typing) */

console.log(3 < 2 < 1); // true

/* by operator precedence it will became false < 1 and coerce

false to 0*/

expected

1 2	true == 1 //true

weird parts

null == 0

//false

null < 1

//true

"" == 0

//true

"" == false

//true

loose equal vs strict equal

use === to prevent coercion and do not use == in 99% cases except you mean to coerce

ref:

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Equality_comparisons_and_sameness

Python Name Conventions

2018 年 6 月 3 日
Python

Must start with (_) or letter (a-z, A-Z), follow by any number of (_) or letter(a-z, A-z) or digit (0-9) except reserved words

Conventions

_my_var: indicate “internal use” or “private” object, cannot get imported by

1	from module import *

__my_var: used to mangle class attributes, useful in inheritance chain

__my_var__: system defined

PEP8 style guide

Event Queue

2018 年 6 月 2 日
JavaScript

When the browser, somewhere outside the JavaScript engine, has the event inside the JavaScript engine that want to be notified of, its get placed in the event queue, and WHETHER OR NOT the event have a function response to it.

The event queue gets looked at by JavaScript when the execution stack is EMPTY.

JavaScript engine is always running synchronously, what happening is that the browser is asynchronously putting things into event queue.

function waitThreeSeconds() {

var ms = 3000 + new Date().getTime();

while (new Date() < ms){}

console.log('finished function');

}

function clickHandler() {

console.log('trigger click event!');

}

document.addEventListener('click', clickHandler);

waitThreeSeconds();

console.log('finished execution');

log the result when double click while long run function(line 11) executed:

finished function

finished execution

trigger click event!

let in ES6

2018 年 6 月 2 日
JavaScript

let allows the JavaScript engine to use BLOCK SCOPING, means variables are only allowed inside specific block, such as if/else statement which defined by {}