TypeScript(四)

六.模塊(命名空間、模塊)

  1. 內部模塊稱為命名空間;注意:命名空間里面的變量是私有的,在外部使用的話需要通過export 暴露出去

    namespace A {}
    
  2. 外部模塊稱為模塊(export、import)

七. 裝飾器

  1. 類裝飾器: 在不修改原來的類的前提下,來拓展類的功能,還能修改類的構造函數

    • 普通裝飾器(無法傳參)

      function logClass(params: any) {
          console.log(params)
          // params就是當前類
          params.prototype.apiUrl = 'www.xxx.com' // 動態擴展的屬性
          params.prototype.run = function() {
              console.log('run')
          }
      }
      @logClass // 調用裝飾器
      class HttpClient {
          constructor() {}
          getData() {}
      }
      let http: any = new HttpClient() 
      console.log(http.apiUrl)
      http.run()
      
    • 裝飾器工廠(可傳參)

      function logClass(params: string) {
          // 這里需要返回一個函數,傳入參數target,target就是當前類
          return function(target: any) {
              target.prototype.apiUrl = params;
          }
      }
      @logClass('www.yyy.com') // 調用裝飾器,這里必須傳參
      class HttpClient {
          constructor() {}
          getData() {}
      }
      let http: any = new HttpClient()
      console.log(http.apiUrl)
      
    • 類裝飾器例子:通過類裝飾器來修改構造函數里的屬性和方法

      function logClass(target: any) {
          console.log(target) // target是當前類
          
          return class extends target {
              apiUrl: any = '我是修改后的數據'
              getData() {
                  this.apiUrl = this.apiUrl + '-------'
                  console.log(this.apiUrl)
              }
          }
      }
      
      @logClass // 調用裝飾器
      class HttpClient {
          public apiUrl: string | undefined
          constructor() {
              this.apiUrl = '我是構造函數里面的apiUrl'
          }
          getData() {
              console.log(this.apiUrl)
          }
      }
      let http = new HttpClient()
      http.getData()
      
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容