---
# System prepended metadata

title: TypeScript異步使用

---

# TypeScript異步使用  

## 異步賦值的簡單方法，增加一些可以等待的特性，譬如 await,then()
 
  執行 assign(<資料>) 可以對 value 賦予資料
  ``` typescript
  const asyncData = asyncAssign()
  asyncData.assign('我是資料')
  asyncData.value // === '我是資料'
  ```
 
  同時對 asyncData 這個 Promise 進行變動檢測的操作都會返回，例如 await,Promise.then()...
  
  ### await 
  ``` typescript
  async function (){
  console.log('等待資料')
 
    await asyncData
    console.log('已經執行 asyncData.assign(), 資料已更新')
    asyncData.value //開始操作
  }
  ```
 
  ### Promise.then()
  ``` typescript
  console.log('等待資料')
 
  asyncData.then((value)=>{
    console.log('已經執行 asyncData.assign(), 資料已更新')
    value //開始操作
  })
  ```
 
  如果您需要資料確切更新的時間點進行動作，可以使用以上兩個方法來處理
 
  value 是實際的資料，當還沒有任何人使用 assign 賦予資料時，value 將會是 undefined.
 
  ### 泛型參數 T :
  value 的實際型別，幫助你在存取 asyncData.value 時知道他是甚麼類型
  ``` typescript
  const asyncData = asyncAssign<string>()
  asyncData.assign('我是資料')
  asyncData.value.substr(0,20) // 輸入 asyncData.value. 時，編輯器會顯示正確的類型，否則它的類型為 any
  ```
 
 回傳一個 Promise ，並在它身上附帶一個方法 assign 與一個屬性 value
 ```typescript!
 export type AsyncAssign<T> = Promise<T> & {assign: ( value: T ) => void;value: T}
 
 export function asyncAssign<T> () {
    let resolveFunc: ( value: T ) => void
    let v: T
    const promise = new Promise<T>( ( resolve ) => {
        resolveFunc = resolve
    } )as AsyncAssign<T>

    promise.assign = function ( value: T ) {
        v = value
        resolveFunc( value )
    }
    Object.defineProperty( promise, 'value', {
        get () {
            return v
        }
    } )

    return promise as AsyncAssign<T>
}
 ```