---
# System prepended metadata

title: 區塊鏈前端 typescript
tags: [區塊鏈, Dapp]

---

# 區塊鏈前端 typescript

[TOC]

###### tags: `Dapp` `區塊鏈`
---
* [教學資料](https://willh.gitbook.io/typescript-tutorial/advanced/class-and-interfaces)
* [create react app /typescript](https://create-react-app.dev/docs/adding-typescript)

---


```javascript=
<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Class Inheritance</h2>

<p>Use the "extends" keyword to inherit all methods from another class.</p>
<p>Use the "super" method to call the parent's constructor function.</p>

<p id="demo"></p>

<script>
class Car {
  constructor(brand) {
    this.carname = brand;
  }
  present() {
    return 'I have a ' + this.carname;
  }
}

class Model extends Car {
  constructor(brand, mod) {
    super(brand);// this.carname = brand;
    this.model = mod;
  }
  show() {
    return this.present() + ', it is a ' + this.model;
  }
}

mycar = new Model("Ford", "Mustang");
document.getElementById("demo").innerHTML = mycar.show();
</script>

</body>
</html>
```
```
Use the "extends" keyword to inherit all methods from another class.

Use the "super" method to call the parent's constructor function.

I have a Ford, it is a Mustang
```
## React Hook

 * [React Hook 筆記 從最基本的useState, useEffect 開始](https://medium.com/hannah-lin/react-hook-%E7%AD%86%E8%A8%98-%E5%BE%9E%E6%9C%80%E5%9F%BA%E6%9C%AC%E7%9A%84-hook-%E9%96%8B%E5%A7%8B-usestate-useeffect-fee6582d8725)

----
### useState
 
![](https://i.imgur.com/vGQvel3.png)


----
### useEffect

![](https://i.imgur.com/2CTBnoI.png)

----
### Typescript array-map method

* [array-map method](https://www.geeksforgeeks.org/typescript-array-map-method/)

![](https://i.imgur.com/UiuvoHJ.png)
