反射：Reflect

反射到底是個什么東西？

它的本質就是一個對象（JS內置的），里邊有一些函數可供調用。

為什要叫做反射？

因為它能做的事情，和其他語言（Java、python等）中的反射很相似。其他語言中都叫做反射了，那就共鳴（降低學習成本？）

反射能做什么事情呢？

let animal = {
 name: "dog",
 age: 3
}
Reflect.get(animal, "name") // 傳參為：對象, 屬性名
// 等同于：
animal.name 

let say = function (type, sound) {
 console.log(`${type}的叫聲是${sound}`)
}
Reflect.apply(say, null, ["貓", "喵喵"]) // 傳參為：函數, this指向, 實參列表
// 等同于：
say("貓", "喵喵")

經過以上代碼我們深刻的發(fā)現Reflect好像沒什么用，非要說些什么的話，他把我們以前的基本操作（比如：obj.name）用調用函數的方式實現了一遍。對了這就是它的意義：減少JS語言魔法，讓代碼更加純粹。

怎么說？

JS語言魔法：我們的操作看起來不太合理，超乎尋常，難以解釋。

解釋一波，Reflect.get(animal, "name")你看著個代碼它又寬又長，看著好像我們要得到 animal 這個對象中 name 這個屬性的值的意思。

再看看animal.name 震驚！只需要這樣，就得到了對象中的屬性的值，雖然學習過JS的伙伴們覺得很正常，但是我們不太能用語言去描述這段代碼做了什么，這就是語言魔法的意思。

想必大家已經對反射有一定了解了，Reflect對象上還有一些其他方法。大家可以看文檔研究一下怎么用，

代理：Proxy

代理到底是個什么東西？

我們都聽過什么代理商、還有代理服務器之類的。比如哪代理服務器來說，我們不能直接訪問到服務器，我們必須要去訪問代理服務器，由代理服務器代替我們去訪問服務器，服務器返回的數據，也要先返回給代理服務器，再由代理服務器返回給我們。

ES6中的代理也是這個意思，我們可以去代理一個對象類型的數據（函數、對象等），然后我們再去訪問對象時，訪問代理就好了。

為啥我們要訪問代理？

因為代理對象給我們提供了修改底層實現的方式，也就是說我們可以在代理對象上進行一些操作，為我們訪問對象制定一些規(guī)則。就像代理服務器可以過濾某些對服務器的訪問等功能。

怎么操作？

Proxy的本質是一個構造函數，

new Proxy(obj, {
 // 一些規(guī)則
})

這樣我們就構造出了一個obj對象的一個代理對象，第二個參數是一個對象它為訪問obj對象制定了一些規(guī)章制度。

new Proxy(obj, {
 get(target, prop){
  // some code
  return Reflect.get(target, prop)
 }
})

這就是在創(chuàng)建代理對象是制定規(guī)則的場景，對比一下Reflect，是不是很想呢。確實反射經常配合Proxy使用

應用：

比如：

function sum(num1, num2){
 return num1 + num2;
}

現在我們?yōu)閟um函數的傳參制定一些規(guī)則：參數必需是number類型的

const sunProxy = new Proxy(sum, {
 apply(target, thisArgument, arguments) {
  arguments.forEach(item => {
   typeof item !== "number" && throw("參數類型非number")
  })
  return Reflect.apply(target, thisArgument, arguments)
 }
})
sunProxy(23, 32)

封裝一下，搞一個通用類型出來

function funcProxy(func, ...types) 
 //執(zhí)行完這個函數返回一個函數的代理，剩余參數是我們規(guī)定的傳參類型
  return new Proxy(func, {
  apply(target, thisArgument, argumentsList) {
   types.forEach((type, index) => {
   // 循環(huán)判斷每一項參數類型是否合法
    typeof argumentsList[index] !== type && throw("傳參類型不符合")
      }
     })
   return Reflect.apply(target, thisArgument, argumentsList);
    }
   })
  }

然后：

const sumProxy = funcProxy(sum, "number", "number")
sumProxy(3, 5);

使用反射我們可以實現一些底層操作，代理可以為我們的調用制定規(guī)則。

是不是很有趣呢大家。

總結

以上就是這篇文章的全部內容了，希望本文的內容對大家的學習或者工作具有一定的參考學習價值，謝謝大家對腳本之家的支持。