以前在學習的時候往往都是囫圇吞棗,有時候就是記個大概,但是沒有深刻的去了解一個知識點,導致很多時候需要用起這個知識點的時候會發現回憶都是零零散散的片段,需要時不時的反復記憶,因此,記錄一些常用的方法還是很有必要的,這里講著重介紹Object,defineProperty()這個方法(當然,ES6中的Reflect物件也有這個方法,畢竟,Reflect物件本來就是繼承了Object物件的,只是在此基礎上,將一些原本在Object物件中有所欠缺的部分稍加彌補修飾罷了),
首先,我們知道,在ES6之前,定義變數的描述只有var,例如:
//定義變數
var num = 100
上面這種方式有一個較大的缺陷,就是在同一范圍下,會導致變數的混淆.此外,由于一個專案往往是多人協同開始,寫在同一個html檔案下的js檔案夾可以互相訪問到var定義的相同屬性,很多程度上導致了臟變數的產生,不僅不容易維護,而且會顯得代碼亂糟糟的,可能這個同名變數一開始是Number型別的,等會兒就會被別人定義成String型別的了,導致變數晚節不保,如下:

定義的變數num不僅值被改了,連型別也轉換了,可以說是面目全非,這不像那些強編譯的語言,一開始就定義好了型別,就算你的值可以改變,但型別是不能轉換的(特殊情況下不算),又比如用var定義一個物件:
var obj = {
id : 1,
name : '兵鍋鍋'
}
我們同樣也可以將其改變的面目全非:

此時我仿佛已經聽到變數對我說:“求求你做個人吧!”
顯而易見,單純使用var來定義屬性很多時候是很尷尬的,為此ES6推出了const和let,這樣可以很大程度上緩解這種問題,首先就可以解決我們上面定義變數的問題,如下:

首先,我定義了一個Stringl型別的變數name,然后我修改這個變數name,發現直接報錯了,顯示:識別符號“name”已經宣告,這就表示如果用const來定義值型別,會導致已經定義好了的值型別會無法更改,多么美妙,那么我如果想改動呢?這個時候var和let就可以幫助你實作了,let不僅可以幫你改變值型別,還有暫時性死區的概念,好用的很,如果想學習建議自己多敲敲代碼,可以看看我的博客《前端必須要會的知識點》查看阮一峰的《ES6標準入門教程》,你想要的它都有,
上面都是針對的值型別,我們既然已經知道使用const可以鎖死值型別,但是還有一個型別值得我們注意,就是參考型別,如果我們使用const來定義參考型別呢?如下:

可以知道,const和var、let一樣,定義的參考型別值都可以被隨意更改,不僅值被改,連基礎的型別也無法得到保障,因此,如果我們要定義一些在參考型別中無法被更改,被重寫的值就可以使用Object.defineProperty()這個方法,
那么,先介紹一下這個方法,Object.defineProperty()這個方法接收4個引數,如下:

現在就可以用來測驗一下,是否可以通過這個方法對參考型別中的屬性(id)值進行保護,如下:

可以看到,即使我們改變了person.id,在輸出person這個物件時,person.id值仍然是1,可見,使用Object.defineProperty()可以用來保護物件的屬性值,為什么要講這個方法呢?因為尤大在Vue框架中使用的雙向系結功能就是通過這個方法來實作的,
知識點是永遠都學不完的,但我們可以把已知的知識點學的更深,在基礎上有更獨到的理解,加油,各位小伙伴們,我們都是最棒的!
轉載請註明出處,本文鏈接:https://www.uj5u.com/qita/229403.html
標籤:AI
