The zwow.github.io from zwow

通过javascript Proxy实现数据绑定

<html>
  <body>
    <div>
      绑定vm：<input type="text" id="model">
      <br/>
      绑定data：<input type="text" id="model2">
    </div>
    <div id="vm">
      {{ num }}
    </div>
  </body>
  <script>
    let data = {
      num: '',
    };
    const getDom = (value) => document.querySelector(value);
    const vmDom = getDom('#vm');
    const modelDom = getDom('#model');
    const model2Dom = getDom('#model2');
    const vm = new Proxy(data, {
      get(target, key, receiver) {
        console.log('getting', target, key, receiver);
        return Reflect.get(target, key, receiver);
      },
      set(target, key, value, receiver) {
        console.log('setting', target, key, value, receiver);
        if (key === 'num') {
          // TODO：遍历获取绑定数据的元素
          modelDom.value = value;
          model2Dom.value = value;
          vmDom.innerHTML = value;
        }
        // target[key] = receiver;
        return Reflect.set(target, key, value, receiver);
      }
    });
    
    modelDom.addEventListener('keyup', (e) => {
      vm.num = e.target.value;
      console.log(data);
    });

    model2Dom.addEventListener('keyup', (e) => {
      data.num = e.target.value;
      console.log(data);
    });

    console.log(vm.num, vm.test);
    setTimeout(() => {
      // 数据驱动视图变化
      vm.num = '14';
      console.log('data', data);
      console.log('vm', vm);
    }, 2000);
  </script>
</html>

前提：今天去面试的是网易前端的外包岗位，事先已经了解到到时候签约的是南油外服的一家第三方外包公司，是拉勾rpo介绍的，当时和我说是工作半年后有机会改签网易正式合同。
面试经过：
面试地点是在科韵路这边的网易大厦，首先我提前了15分钟多来到，来到后先填写一张面试登记表，里面信息比较多，到hr喊我过去面试的时候都还没写完（尴尬），不过hr和我说没写完也没问题，直接就带我上了5楼的小会议室等面试官。没过几分钟来了两位面试官，先是看了我的简历一阵然后就开始了面试。
首先是自我介绍，我说了大概的工作经验呀，做过的项目涉及的技术之类的，然后提到之前做过小程序下的IM聊天和制定过vue开发规范，然而整个过程中并没有提及相关问题，应该是对这些点不感兴趣。

问题大概有以下几点：
1.Vue.use的作用，原理
2.Vue组件间通信怎么实现（非父子组件间），我回答了事件总线eventbus，然后让我写实现（1）
3.前公司有没有遇到过跨域问题，写下jsonp的实现（2）
4.怎么让用使用setInterval实现的倒计时变得精确，写下实现（3）
5.有没做过移动端项目，移动端怎么适配不同机型的分辨率和物理像素
6.移动端有没遇到过滚动不流畅问题，怎么解决
7.怎么写一个高性能的随机打乱数组顺序的方法，写实现（4）

注：上面标数字的都是要求我现场在纸上手写代码的，有些点我写的比较久就直接让我说思路了，然后感觉两位面试官各有侧重，一位侧重pc端，一位侧重移动端。

接下来逐点分析考察内容，(未完待续）

第一点，问了我Vue.use的作用，这里我回答可能不是很清晰，说了作用是将插件注册到vue的原型上。

zwow / zwow.github.io Goto Github PK

zwow.github.io's People

Contributors

Stargazers

zwow.github.io's Issues

通过javascript Proxy实现数据绑定

（网易游戏-cc直播）前端外包面试经验

Recommend Projects

React

Vue.js

Typescript

TensorFlow

Django

Laravel

D3

Recommend Topics

javascript

web

server

Machine learning

Visualization

Game

Recommend Org

Facebook

Microsoft

Google

Alibaba

D3

Tencent