FB Front End Engineer 前端電面分享 + 求最佳解

最近剛剛才跟FB 電面

小弟不是很強所以希望大大們指導 求進步：


廢話不 直接切入問題：

Create a DOMStore so that it has three methods: set, get, has.
The DOMStore should be able to store a DOM Node and return the value associated with the particular Node.

Example usage:

[        DISCUZ_C

您好！
本帖隐藏的内容需要积分高于 188 才可浏览
您当前积分为 0。
使用VIP即刻解锁阅读权限或查看其他获取积分的方式

游客，您好！
本帖隐藏的内容需要积分高于 188 才可浏览
您当前积分为 0。
VIP即刻解锁阅读权限 或 查看其他获取积分的方式
Unlock interview details and practice with AI
Curated Interview Questions from Top Companies

但是要是兩個不同的DOMNode 他想要的答案是什麼？？


以下是我的代碼：

1. 
   
2. class DOMStore {
   
3.   constructor() {
   
4.     this.store = [];
   
5.   }
   
6.   
   
7. 
   
8.   findIndex(node) {
   
9.     // O(n)
   
10.     for(let i =0; i < this.store.length; i++ ) {
    
11.       if (this.store[i][0] === node) {
    
12.         return i;
    
13.       }      
    
14.     }
    
15.     return -1;
    
16.   }
    
17.   
    
18.   
    
19.   set(node,val) {
    
20.    let i = this.findIndex(node);
    
21.    if (this.findIndex(node) > -1) {
    
22.       this.store[i][1] = val;
    
23.    } else {     
    
24.     this.store.push({node,val});
    
25.    }
    
26.   }
    
27.   
    
28.   
    
29.   get(node) {   
    
30.    // returns val if exists
    
31.     if (this.findIndex(node) > -1) {
    
32.       return this.store[i][1];
    
33.     } else {
    
34.       return undefined;
    
35.     }
    
36.   }
    
37.   
    
38.   
    
39.   has(node) {
    
40.     if ( this.findIndex(node) > -1) {      
    
41.       return true;
    
42.     } else {
    
43.       return false;
    
44.     }  
    
45.   }
    
46.   
    
47. }
    

复制代码

求最佳解！！！ 拜託麻煩了 謝謝個位神人    ：）

您好！
本帖隐藏的内容需要积分高于 100 才可浏览
您当前积分为 0。
使用VIP即刻解锁阅读权限或查看其他获取积分的方式

游客，您好！
本帖隐藏的内容需要积分高于 100 才可浏览
您当前积分为 0。
VIP即刻解锁阅读权限 或 查看其他获取积分的方式
Unlock interview details and practice with AI
Curated Interview Questions from Top Companies

您好！
本帖隐藏的内容需要积分高于 100 才可浏览
您当前积分为 0。
使用VIP即刻解锁阅读权限或查看其他获取积分的方式

游客，您好！
本帖隐藏的内容需要积分高于 100 才可浏览
您当前积分为 0。
VIP即刻解锁阅读权限 或 查看其他获取积分的方式
Unlock interview details and practice with AI
Curated Interview Questions from Top Companies

js object应该是可以用node做key的？。。。刚在浏览器里试了下

您好！
本帖隐藏的内容需要积分高于 100 才可浏览
您当前积分为 0。
使用VIP即刻解锁阅读权限或查看其他获取积分的方式

游客，您好！
本帖隐藏的内容需要积分高于 100 才可浏览
您当前积分为 0。
VIP即刻解锁阅读权限 或 查看其他获取积分的方式
Unlock interview details and practice with AI
Curated Interview Questions from Top Companies

jonesG 发表于 2020-3-10 10:45
试了一下还真的可以，不过js object无法区分开两个内容相同的node, ES6 Map可以区分

哦哦那可能问的就是如何生成一个dom node的unique id了吧，感觉可以xpath试一下？

参考glassdoor上的讨论 找到一种用Symbol的做法

1. class DOMStore {
   
2.         constructor() {
   
3.                 this.domStoreProp = Symbol();
   
4.         }
   
5. 
   
6.         set(node, value) {
   
7.                 node[this.domStoreProp] = value;
   
8.         }
   
9. 
   
10.         get(node) {
    
11.                 return node[this.domStoreProp];
    
12.         }
    
13. 
    
14.         has(node) {
    
15.                 return !!this.get(node);
    
16.         }
    
17. }

复制代码

用symbol应该是正解，其实类似WeakMap的实现。
这里要求是储存DOM node. 如果用一个array或者什么其他的结构去存的话，这个reference不会被gc掉，在实际应用中会导致内存泄漏。

您好！
本帖隐藏的内容需要积分高于 100 才可浏览
您当前积分为 0。
使用VIP即刻解锁阅读权限或查看其他获取积分的方式

游客，您好！
本帖隐藏的内容需要积分高于 100 才可浏览
您当前积分为 0。
VIP即刻解锁阅读权限 或 查看其他获取积分的方式
Unlock interview details and practice with AI
Curated Interview Questions from Top Companies

yonwin 发表于 2020-4-12 11:18
不可以的，object会被convert成string“[object Object]”，所有的object都会被转成这个字符串，然后存成 ...

原来如此！