|
按照 target 范例适配差异的 handler，假如是荟萃 ( Map、Set )就行使 collectionHandlers，是其他范例就行使 baseHandlers。接下来看看 collectionHandlers
- export const mutableCollectionHandlers: ProxyHandler<any> = {
- get: createInstrumentationGetter(mutableInstrumentations)
- }
- export const readonlyCollectionHandlers: ProxyHandler<any> = {
- get: createInstrumentationGetter(readonlyInstrumentations)
- }
没有不测只有 get，骚就骚在这儿:
- // 可变数据插桩工具，以及一系列响应的插桩要领
- const mutableInstrumentations: any = {
- get(key: any) {
- return get(this, key, toReactive)
- },
- get size() {
- return size(this)
- },
- has,
- add,
- set,
- delete: deleteEntry,
- clear,
- forEach: createForEach(false)
- }
- // 迭代器相干的要领
- const iteratorMethods = ['keys', 'values', 'entries', Symbol.iterator]
- iteratorMethods.forEach(method => {
- mutableInstrumentations[method] = createIterableMethod(method, false)
- readonlyInstrumentations[method] = createIterableMethod(method, true)
- })
- // 建设getter的函数
- function createInstrumentationGetter(instrumentations: any) {
- return function getInstrumented(
- target: any,
- key: string | symbol,
- receiver: any
- ) {
- target =
- hasOwn(instrumentations, key) && key in target ? instrumentations : target
- return Reflect.get(target, key, receiver)
- }
- }
因为 Proxy 的 traps 跟 Map|Set 荟萃的原生要领纷歧致，因此无法通过 Proxy 挟制 set，以是作者在在这里举办了"偷梁换柱"，这里新建设了一个和荟萃工具具有沟通属性和要领的平凡工具，在荟萃工具 get 操纵时将 target 工具换成新建设的平凡工具。这样，当挪用 get 操纵时 Reflect 反射到这个新工具上，当挪用 set 要领时就直接挪用新工具上可以触发相应的要领，是不是很奇妙?以是多看源码甜头多多，可以多学学人家的骚操纵。
IE 怎么办?
这是个其实不想提但又绕不开的话题，IE 在前端开拓者眼里和妖怪没什么区别。在 Vue3.0 之前，相应式数据的实现是依靠 ES5 的 Object.defineProperty，因此只要支持 ES5 的赏识器都支持 Vue，也就是说 Vue2.x 能支持到 IE9。Vue3.0 依靠的是 Proxy 和 Reflect 这一对出生新期间的 CP，且无法被转译成 ES5，可能通过 Polyfill 提供兼容，这就忧伤了。开拓者技能前列获悉的信息，官方在宣布最终版本之前会做到兼容 IE11，至于更低版本的 IE 那就只有奉上一曲凉凉了。
着实也不消太纠结IE的题目，由于连微软本身都已经放弃治疗 IE 拥抱 Chromium 了，我们又何须纠结呢?
结语
在行使开源框架时不要忘了，我们之以是能免费试用他，靠的维护者投入的大量精神。但愿我们多去发明它带来的利益和作者想通过它转达的编程头脑。最后等候 Vue3.0 正式版本的早日到来。 （编辑：湖南网）
【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!
|
