@zoecodes|@zoejokes
Mocha
LiveScript
JavaScript
ECMAScript
=
the study of meaing-making
the study of signs
Lizzy Stewart
sign
signified
signifier
Diddy
Puff Daddy
Sean Combs
pink
?
blorble
let literally = "literally";
literally = "figuratively";
let figuratively = "figuratively";
literally = figuratively;
| fruit | color | |
|---|---|---|
| Spanish | naranja | naranjado |
| Italian | arancia | arancione |
| French | orange | orange |
| fruit | color | |
|---|---|---|
| Arabic | burtaqal | burtiqali |
| Greek | portokali | portokalóchrous |
| Romanian | portocaliu | portocaliu |
| fruit | color | |
|---|---|---|
| Norwegian | appelsin | oransje |
| German | Apfelsine | Orange |
| Dutch | sinaasappel | oranje |
npm
Public domain
Wikipedia
when we make something hard easy
we make something easy hard.
this
let artist = "P. Diddy";
let releaseYear= 2001;
function badBoyForLife(rapper, year){
const badBoy = true;
let casketDrop = false;
if (casketDrop){
return `${rapper} is dead.`
} else {
return `Bad boy since ${year}.`
}
}
function theSagaContinues() {
let artist = "Puff Daddy";
badBoyForLife(artist, releaseYear);
}
theSagaContinues();
global execution context
| item | inventory |
|---|---|
| variables | artist, releaseYear |
| functions | badBoyForLife, theSagaContinues |
| other scopes | none |
| this | Window |
theSagaContinues's execution context
| item | inventory |
|---|---|
| variables | artist |
| functions | none |
| other scopes | global execution context |
| this | Window |
let artist = "P. Diddy";
let releaseYear= 2001;
function badBoyForLife(rapper, year){
const badBoy = true;
let casketDrop = false;
if (casketDrop){
return `${rapper} is dead.`
} else {
return `Bad boy since ${year}.`
}
}
function theSagaContinues() {
let artist = "Puff Daddy";
badBoyForLife(artist, releaseYear);
}
theSagaContinues();
let name = "Sean Combs";
function musicCareer(){
let name = "Puff Daddy";
name = "Puff Daddy";
console.log(name);
}
musicCareer();
// "Puff Daddy"
console.log(name)
// "Sean Combs"
// "Puff Daddy";
const name = "Sean Combs";
function musicCareer(){
name = "Puff Daddy";
let name = "Puff Daddy";
console.log(name);
}
musicCareer()
// Assignment to constant variable.
// "Puff Daddy"
// "Sean Combs"
console.log(name)
// "Sean Combs"
the same code from before
let artist = "P. Diddy";
let releaseYear= 2001;
function badBoyForLife(rapper, year){
const badBoy = true;
let casketDrop = false;
if (casketDrop){
return `${rapper} is dead.`
} else {
return `Bad boy since ${year}.`
}
}
function theSagaContinues() {
let artist = "Puff Daddy";
badBoyForLife(artist, releaseYear);
}
theSagaContinues();
theSagaContinues's execution context
| item | inventory |
|---|---|
| variables | artist |
| functions | none |
| other scopes | global execution context |
| this | Window |

function banana(){
console.log(this)
}
banana();
// Window
const bananaBread = {
banana: function(){
console.log(this);
}
}
bananaBread.banana();
// Object {bananaBread}
function banana(){
console.log(this);
function coverInChocolate(){
console.log(this);
}
coverInChocolate();
}
banana();
// Window
// Window
const bananaBread(){
banana: function(){
console.log(this);
function coverInChocolate(){
console.log(this);
}
coverInChocolate();
}
}
bananaBread.banana();
// Object {bananaBread}
// Window
const bananaBread = {
banana: function(){
console.log(this);
function coverInChocolate(){
console.log(this);
}
coverInChocolate();
let choconan = coverInChocolate.bind(this)
choconan();
}
}
bananaBread.banana();
// Object {bananaBread}
// Window
// Object {bananaBread}
class App extends React.Component{
constructor(){
super();
this.state = {};
this.handleClick = this.handleClick.bind(this);
}
function handleClick(){
}
handleClick = () =>{
}
render(){
return(
)
}
}
const bananaBread = {
banana: function(){
console.log(this);
function coverInChocolate(){
console.log(this);
}
coverInChocolate = () => {
console.log(this)
}
coverInChocolate();
}
}
bananaBread.banana();
// Object {bananaBread}
// Window
// Object {bananaBread}
It is weirdly hard to explain simple things
because we make meaning from the ...web
Bowser from Super Mario
Nintendo
TW Turtle from Cats Don't Dance
Warner Brothers
Filburt from Rocko's Modern Life
Nickelodeon
Speed from the Swan Princess
Swan Princess Wiki
Bert from Duck and Cover
Federal Civil Defense Administration (1951)
Morla from The Neverending Story
Internet
Leonardo from Teenage Mutant Ninja Turtles
Nintendo?
Rafael from Teenage Mutant Ninja Turtles
New Line Cinema
Michaelangelo from Teenage Mutant Ninja Turtles
Murakami-Wolf-Swenson Film Productions, Inc.
Yertle from Yertle the Turtle
Dr. Seuss
Mack from Yertle the Turtle
Dr. Seuss
Franklin from Franklin
Wikipedia
Mock Turtle from Alice in Wonderland
Lewis Carroll
Mock Turtle from H&M
H&M
Crush from Finding Nemo
Disney
Donatello from Teenage Mutant Ninja Turtles
Halloween Costumes dot com
@zoecodes|@zoejokes
@zoecodes|@zoejokes