腾讯前端常考面试题汇总

yyds2026

已于 2022-09-26 13:34:19 修改

阅读量1.6k

点赞数

文章标签：前端框架 javascript

于 2022-09-13 10:13:40 首次发布

本文链接：https://blog.youkuaiyun.com/yyds2026/article/details/126828085

版权

本文汇总了腾讯前端面试中常见的考题，包括手写 bind、apply、call，Vue 双向数据绑定原理，Event loop 详解，闭包概念，Unicode、UTF-8、UTF-16、UTF-32 的区别，箭头函数的 this 指向，防御 CSRF 攻击策略，以及更多前端核心知识点。深入理解这些内容，对于提升前端技能和应对面试至关重要。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

手写 bind、apply、call

// call

Function.prototype.call = function (context, ...args) {
   
  context = context || window;

  const fnSymbol = Symbol("fn");
  context[fnSymbol] = this;

  context[fnSymbol](...args);
  delete context[fnSymbol];
}

// apply

Function.prototype.apply = function (context, argsArr) {
   
  context = context || window;

  const fnSymbol = Symbol("fn");
  context[fnSymbol] = this;

  context[fnSymbol](...argsArr);
  delete context[fnSymbol];
}

// bind

Function.prototype.bind = function (context, ...args) {
   
  context = context || window;
  const fnSymbol = Symbol("fn");
  context[fnSymbol] = this;

  return function (..._args) {
   
    args = args.concat(_args);

    context[fnSymbol](...args);
    delete context[fnSymbol];   
  }
}

前端进阶面试题详细解答

vue实现双向数据绑定原理是什么？

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script src="https://cdn.bootcss.com/vue/2.5.16/vue.js"></script>
    <!-- 引入vue文件 -->
    <div id="box">
      <new-input v-bind:name.sync="name"></new-input>
      {
  {name}}
      <!-- 小胡子语法 -->
      <input type="text" v-model="name" />
    </div>
    <script>
      Vue.component("new-input", {
             props: ["name"],        data: function () {
               return {
                 newName: this.name,          };        },        template: `<label><input type="text" @keyup="changgeName"        v-model="newName" /> 你的名字：</label>`,        // 模板字符串
        methods: {
               changgeName: function () {
                 this.$emit("update:name", this.newName);          },        },        watch: {
               name: function (v) {
                 this.newName = v;          },        },        //    监听
      });      new Vue({
             el: "#box",        //挂载实例
        data: {
               name: "nick",        },        //赋初始值
      });    </script>
  </body>
</html>

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>

最低0.47元/天解锁文章