{
// HINT: The success is actually defined within this notebook.
// HINT: You're only allowed to change 3 characters in this code block
if(false) {
var success = () => "Failed"
}
return success() // --> "All Good"
}
{
if(true) {
const succeed = true
}
// plz don't change the line below
return succeed && success() // --> "All Good"
}
{
const cat = {
species: "gato",
sound: "meow"
}
// don't change this function
const animalMakeNoise = function() {
return this.sound
}
return animalMakeNoise() // --> "meow"
}
{
const dog = {
species: "perro",
name: "no name",
changeName: name => this.name = name
}
dog.changeName("Chrisse") // don't change this line
return dog.name // --> "Chrisse"
}
{
// HINT: our bunny is fine the way s/he is
const rabbit = {
species: "conejo",
age: 2,
weight: 20,
getOlder: function() { this.age++ },
getHeavier: function() { this.weight+=20 }
}
// HINT: there's nothing wrong with this
const doBoth = (fun1, fun2) => {
fun1()
fun2()
}
doBoth(rabbit.getOlder, rabbit.getHeavier)
return "Age: " + rabbit.age + " Weight: " + rabbit.weight // "Age: 3 Weight: 40"
}
{
function Quokka(name) {
this.species = "quokka" // Fun fact: this animal is spelled the same in English & Spanish
this.nationality = "Australia"
this.name = name
}
Quokka.greet = function() {
return "¡Hola! Me llamo " + this.name + ". Soy un " + this.species + " de " + this.nationality
}
const fred = new Quokka("Fred")
return fred.greet() // --> "Hola! Me llamo Fred. Soy un quokka de Australia"
}
class Animal {
constructor(species, name, speaks) {
this.species = species || "alien"
this.name = name || "no name"
this.speaks = speaks || "English"
}
greet() {
if(this.speaks === "Spanish") {
return "¡Hola! Me llamo " + this.name + ". Soy un " + this.species + ". "
} else if(this.speaks === "Japanese") {
return "こんにちは！ 私の名前は" + this.name + "。 私は" + this.species + "です。"
} else {
return "Hello! My name is " + this.name + ". I'm a " + this.species + ". "
}
}
}
// constructor method is used as class constructor
doraemon = new Animal("cat", "ドラえもん", "Japanese")
doraemon.greet()
doraemon instanceof Animal
// classes are still constructor functions
typeof Animal
// still use prototypes to inherit methods
doraemon.__proto__ === Animal.prototype
class Moose extends Animal {
constructor(name) {
// run superclass constructor
super("moose", name, "English")
}
greet() {
// extend superclass method
return super.greet() + "I'm from Canada."
}
}
liam = new Moose("Liam")
liam.greet()
liam instanceof Animal && liam instanceof Moose
{
const a = 2
const b = 3
// interpolates strings without using the + operator
return `${a} + ${b} = ${a+b}`
}
"Normal
Strings
Cannot
Be
Multiline
"
{
const animal = {
alive: true,
moves: true,
sound: "silent",
hasTail: false,
}
const dog = {
species: "dog",
sound: "woof",
// properties that come before the spread may be overwritten
...animal,
// properties that come after the spread are overridden
hasTail:true
}
return dog
}
{
const everyonesNumbers = [ 100, 200, 300, 400, ]
// inserts array elements
const myNumbers = [ 9, 8, ...everyonesNumbers, 7, 6, 5, 4 ]
return myNumbers
}
makeArray = (...allNumbers) => allNumbers
makeArray(1,2,3,4,5,6)
complicatedObject = ({
a: {
b: {
c: {
d: {
e: "foo bar"
},
f: "hello world"
}
}
}
})
{
const oldE = complicatedObject.a.b.c.d.e
const { e } = complicatedObject.a.b.c.d
const { e:namedE } = complicatedObject.a.b.c.d
const { d: { e:nestE }, f } = complicatedObject.a.b.c
return { e, oldE, namedE, nestE, f }
}
complicatedArray = [
"foo",
[ "bar" ],
[
"baz",
[ "hello" ],
]
]
{
const oldFoo = complicatedArray[0]
const [ foo ] = complicatedArray
const [ bar ] = complicatedArray[1]
const [ baz, [ hello ] ] = complicatedArray[2]
return { oldFoo, foo, bar, baz, hello }
}
{
const mike = { name: "Mike" }
const sayName = ({ name }) => `My name is ${name}`
return sayName(mike)
}
{
const noahsArk = [ "pig", "giraffe", "elephant", "rhino", "dinosaur", "bird", "wolf", "quokka" ]
const [ animal1, animal2, ...otherAnimals ] = noahsArk
return {
animal1,
animal2,
otherAnimals
}
}
{
const myDiet = {
protein: "Beef",
carbohydrates: "Noodles",
starch: "Potato",
fats: "Cake",
oils: "Hickey Fries",
}
const { protein, carbohydrates, ...otherComponents } = myDiet
return {
protein,
carbohydrates,
otherComponents
}
}
{
const continents = [ "North America", "South America", "Africa", "Europe", "Asia", "Antarctica", "Australia" ]
const combineFirstAndSecond = ([ first, second, ...rest ]) => {
const firstAndSecond = first+" & "+second
rest.unshift(firstAndSecond)
return rest
}
return combineFirstAndSecond(continents)
}
exerciseExample = (function() {
const SECRET = "we;ofijaweg;iajewf;iaej"
const NOT_SECRET = "weaewga;gaewrg;taerwae;frawe"
const seqq = [ 1,2,NOT_SECRET,SECRET, NOT_SECRET ]
const excite = ([A,B,...C]) => {
return n => { var a = Array(n); a[B] = C; return a }
}
return { thing:excite(seqq) }
})()
exerciseExample.thing(2)[2][1]
problemOne = ([first, second, ...other]) => other.reduce( (ag,v) => v * first / second * ag, 1 )
problemTwo = class extends Animal {
constructor(name, jobTitle) {
super("humano", name, "Spanish")
this.job = jobTitle
}
greetWithJob() {
return super.greet() + "Soy " + this.job + ". "
}
}
problemThree = (strings, ...inserts) => strings.reduce( (ag,v,k) => ag + inserts[k-1] + v )
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
