Setting up a Node ServerWeek 12 - Interaction and Animation: D3 Transitions, Behaviors, and BrushingWeek 11 - Intro to D3.js: Mapping Data with D3Week 10 - Intro to D3.js: Making a ChartParsing API ResponsesWeek 4a - Exploring Data with Vega-LiteWeek 3 - Data Management with ZebrasWeek 2a - Introduction to Javascript Part2Week 1a - Introduction to HTML and JavascriptWeek 0 - Introduction to Observable
Week 1b - Introduction to Javascript
//JavaScript makes HTML pages more dynamic and interactive.
{
console.log("Hello world");
// or
var helloMit = "Hello MIT";
console.log(helloMit);
}
//console.log() is a function which log in the actual console, not in observable.console is a subset of your browser. what your write on the observable will show up in console, but what you write in console will not show up in observable.
// if want to clear the content in console: clear()
//similar to stata
/*this is a multiline comment*/
height = 500
height= 800
//you cannot define a variable numtiple times. If you change one part in the oberservable, everything in the note will be affected. Unless you define that only in a block.
//注意与其他语言不同，obervable并不是从上到下一个个跑命令。对同一个变量不能赋值两次。
dimension = ({height, width})
width = 480
// dimension = {1000, 960}
// This block defines a cumulative sum of numbers from 0 to 10
{
let x = 0;
for (let i = 1; i <= 10; ++i) {
x += i;
}
return x;
}
//you must assign a variable in order to retrieve it later.
firstNumber
// when trying to access to the variable outside of the scope, errors show up.
x
function running_total(max) {
let x = 0;
for (let i = 1; i <= max; ++i)
x += i;
return x;
}
//when first define a variable you need to use "let"
running_total(10)
{
const a = 5;
a = 6;
return a;
}
//you cannot change a constant over time
{
let a = 5;
a = 6
return a;
}
1 + 2
typeof (1 + 2)
1.0 + 2.5
typeof (1.0 + 2.5)
2 / 0
typeof (2 / 0)
"a" / 2
typeof ("a" / 2)
//useful for flow control
"hello, world"
typeof "hello, world"
"hello, " + "world"
name = "ycfan" // Fill your name in here!
`hello, world, it's ${name}`
//可以用 ${}引用之前定义的变量
typeof (`hello, world, it's ${name}`)
9 > 10
typeof (9 > 10)
10 == 10
//注意这里的and是两个&&
(9 > 10) && (10 == 10) // Evaluates to false AND true
(9 > 10) || (10 == 10) // Evaluates to false OR true
!(9 > 10) && (10 == 10) // Evaluates to NOT(false) AND true
!((9 > 10) || (10 == 10)) // Evaluates to NOT(false or true)
typeof (x)
{ let y
return typeof (y)
}
ra = ["one", 2, 3.0]
typeof ra
ra[0]
ra[3]
function addthese(a, b) {
return a+b;
}
typeof(addthese)
typeof(addthese(1, 4))
"hello, world".toUpperCase()
directory = {
const data = {"employees":[
{"firstName":"John", "lastName":"Doe"},
{"firstName":"Anna", "lastName":"Smith"},
{"firstName":"Peter", "lastName":"Jones"}
]};
return data
}
directory.employees
directory.employees[1]
directory.employees[1].firstName
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.
