Designer, Artist, Researcher, Educator @sugi2000lab .
co-translator for Japanese edition of “Generative Design” and “Code as Creative Medium”.
{
let i = 0;
yield i;
while (true) {
yield Promises.delay(1000, ++i);
}
}
{
let i = 0;
yield i;
let interval = setInterval(() => {
i++;
}, 1000);
try {
while (true) {
yield i;
}
} finally {
clearInterval(interval); // ただし、再評価時に破棄されます。
}
}
Generators.observe(notify => {
let i = 0;
notify(i);
let interval = setInterval(() => notify(++i), 1000);
return () => clearInterval(interval);
})
// このセルを実行してください
a = [1, 2, 3, 4]
// 次に、このセルを数回実行してください
a.splice(0, 1)
// 最後に、このセルを実行してください
a.length
b = [1, 2, 3, 4]
c = {
let copy = b.slice();
copy.splice(0, 1);
return copy;
}
c.length
myObject = ({hi:'Tom'})
(myObject.key = Date.now())
myObject
myObjectWithKey = ({ key: Date.now(), ...myObject })
myObjectWithoutHi = _.omit(myObjectWithKey, 'hi')
{
let i = 0;
for (; i < 10; i++) {
yield i;
}
return i;
}
{
let i = 0;
for (; i < 10; i++) {
yield i;
}
yield i;
}
{
function* hasReturnValue() {
yield "a";
yield "b";
return "The result";
}
let finalValue = yield* hasReturnValue();
yield finalValue;
}
html`<div id='my-fun-element'></div>`
document.querySelector('#my-fun-element').innerText = 'What a fun element!'
myElement = html`<div></div>`
(myElement.innerText =
"これは私の要素で、常に永遠に機能し続けることが分かっています。")
chart = {
const svg = d3.select(DOM.svg(width, 100));
const x = d3.scaleLinear().domain([0, 500]).range([0, width]);
const y = d3.scaleLinear().range([20, 80]);
svg
.append("path")
.datum(d3.range(500).map(() => Math.random()))
.attr("fill", "none")
.attr("stroke", "steelblue")
.attr("stroke-width", 1.5)
.attr("stroke-linejoin", "round")
.attr("stroke-linecap", "round")
.attr(
"d",
d3
.line()
.x((d, i) => x(i))
.y(y)
);
return svg.node();
}
viewof randomize = html`<button>ランダムに色を変更</button>`
randomize, d3.select(chart).select('path').attr('stroke', `hsl(${Math.random() * 100}, 100%, 50%)`)
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.
