JaysonChiang

import { useState } from 'react';

const TodoList: React.FC = () => {
  const [todo, setTodo] = useState('');
  const [todos, setTodos] = useState<string[]>([]);

  const onClick = () => {
    setTodo('');
    setTodos([...todos, todo]);
  };

JaysonChiang

import { useState } from 'react';

const TodoList = () => {
  const [todo, setTodo] = useState('');
  const [todos, setTodos] = useState([]);

  const onClick = () => {
    setTodo('');
    setTodos([...todos, todo]);
  };

JaysonChiang

interface ChildProps {
  name: string;
  onClick: () => void;
}

const Child: React.FC<ChildProps> = ({ name, onClick }) => {
  return (
    <div>
      {name}
      <button onClick={onClick}>Click</button>

JaysonChiang

interface ChildProps {
  name: string;
  onClick: () => void;
}

const Child = ({ name, onClick }: ChildProps) => {
  return (
    <div>
      {name}
      <button onClick={onClick}>Click</button>

JaysonChiang

abstract class Bike {
  abstract brandname: string;
  ride() {
    return `I ride ${this.brandname}`;
  }
}

class Giant extends Bike {
  brandname = 'Giant';
}

JaysonChiang

// public method
function Bike() {}

Bike.prototype.ride = function () {
  return "I ride " + this.brand;
};

// static method
function BikeMaker() {}
BikeMaker.factory = function (brandname) {

JaysonChiang

        function thousandComma(number) {
            var num = number.toString();
            var pattern = /(-?\d+)(\d{3})/;

            while (pattern.test(num)) {
                num = num.replace(pattern, "$1,$2");
            }
            return num;
        }