Introductions

Exploratory and Expository

  • Custom data visualizations can be categorized into two broad categories:

    • Expository vs. exploarotry
  • Expository

    • static dataset
    • explore data for story
    • communicate story to audience
  • Examples:

Introduction

GitHub Repo

  • Why Vue.js

    • Declarative
    • Legible
    • Easy to Maintain
    • Powerful
    • A collection of the best of the best
    • Elegant
    • Gives me what I want when I need it, and gets out of my way
    • A way to be really productive
    • Goodness gracious it’s freaking fun
  • Comparison with other frameworks

    • A virtual DOM
    • Reactive components that offer the View layer only
    • Props and a Redux-like store similar to React
    • Conditional rendering, and services, similar to Angular
    • Inspired by Polymer for simplicity and performance, Vue offers a similar development style as HTML, styles, and JavaScript are composed in tandem
    • Slightly better performance than React, no use of polyfills like Polymer, and an isolated, less opinionated view than Angular, which is an MVC
      阅读全文 »

Introduction

  • Course overview

    1. Principles of JavaScript
    2. Higher order functions
    3. Arrow and anonymous functions
    4. reduce, filter and chaining higher order functions
    5. Function composition & pure functions
    6. Closure
    7. Function decoration
    8. Partial application and currying
  • Functional programming

Bash

Introducing UNIX

  • UNIX

    • UNIX was an operating system developed at AT&T Bell Labs in the 1960s through the 1980s
    • GUN/Linux, MacOSX, and Android are all based on ideas and specifications created by UNIX
  • time-sharing

    • UNIX was orininally built for large mainframe computers that many people would use at the same time
  • terminals and teleprinters

    • teleprinters printed program output on paper
    • terminals displayed output on a CRT monitor
    • neither device had processing power of their own
    • connected to the mainframe over cables or by telephone
      阅读全文 »

一段代码

在讨论JS函数执行的时机之前,我们先来看一段代码

1
2
3
4
5
6
let i = 0
for(i = 0; i<6; i++){
setTimeout(()=>{
console.log(i)
},0)
}

请问,执行上述代码,最终控制台输出结果是什么?

  1. setTimeout的id, 0, 1, 2, 3, 4, 5
  2. setTimeout的id, 6, 6, 6, 6, 6, 6

可能有人会写出上述代码,并期望得到结果1,但实际控制台会输出结果2。

阅读全文 »

CSS Transitions

Introduction

web animation weekly

  • Overview
    • CSS Transitions & Animations
    • How to use animation in product design
    • How to create stateful animations with JavaScript
    • How to use developer tools to manipulate animations
    • How to design performent animations
      阅读全文 »

本文章资料主要来自饥人谷2020版前端体系课,本文为课程笔记

语法

  • 对象的定义

    • 无序的数据集合
    • 键值对的集合
  • 声明对象

    • const obj = { 'name': 'Frank', 'age': 18 }
    • const obj = new Object({ 'name': 'Frank' })
    • console.log({ 'name': 'Frank', 'age': 18 })
      阅读全文 »
0%