分享两道阿里前端笔试题（附答案）

￡神魔★判官ぃ 2022-09-10 03:18 223阅读 0赞

## 1. 实现一个简单的模板渲染，给定一个模板和一个对象，利用对象中的数据生成模板字符串，并返回最终结果。 ##

function renderTpl(tpl, data) { 
      // 代码写在这里
    }
    
    let tpl = '你好，我们公司是{company}，我们部门是{bu}';
    let tplData = { 
      company: '阿里巴巴',
      bu: '天猫精灵'
    }
    
    const str = renderTpl(tpl, tplData);
    console.log(str); // 你好，我们公司是阿里巴巴，我们部门是天猫精灵
    
    // 最终输出结果为：你好，我们公司是阿里巴巴，我们部门是天猫精灵。

### 解题: ###

function renderTpl(tpl, data) { 
      Object.keys(data).forEach((k) => { 
        tpl = tpl.replace(`{ ${ k}}`, data[k]);
      });
      return tpl;
    }
    
    let tpl = "你好，我们公司是{company}，我们部门是{bu}";
    let tplData = { 
      company: "阿里巴巴",
      bu: "天猫精灵",
    };
    
    const str = renderTpl(tpl, tplData);
    console.log(str); // 你好，我们公司是阿里巴巴，我们部门是天猫精灵

## 2. 实现find函数，使得下面的方法调用正确 ##

// 约定：
    // title数据类型为String
    // userId为主键，数据类型为Number
    const data = [
      { userId: 8,  title: 'title1'},
      { userId: 11, title: 'other'},
      { userId: 15, title: null},
      { userId: 19, title: 'title2'}
    ];
    const find = function(origin) { 
      // 代码写在这里...
    }
    
    // 查找 data 中，符合条件的数据，并进行排序
    const result = find(data).where({ 
      'title': /\d$/
    }).orderBy('userId', 'desc');
    
    const result1 = find(data).orderBy('userId', 'asc').where({ 
      'title': /\d$/
    })
    
    console.log(result); // [ { userId: 19, title: 'title2' }, { userId: 8, title: 'title1' } ]
    console.log(result1); // [ { userId: 8, title: 'title1' }, { userId: 19, title: 'title2' } ]

### 解题: ###

const data = [
      {  userId: 8, title: "title1" },
      {  userId: 11, title: "other" },
      {  userId: 15, title: null },
      {  userId: 19, title: "title2" },
    ];
    const find = function (origin) { 
      let obj = new Object(origin);
    
      Object.defineProperty(obj, "where", { 
        configurable: false, // 是否可配置
        enumerable: false, // 是否可迭代
        writable: false, // 是否可写
        value: function (where) { 
          for (let key in where) { 
            if (where.hasOwnProperty(key)) { 
              obj = obj.filter((v) => where[key].test(v[key]));
            }
            return find(obj);
          }
        },
      });
    
      Object.defineProperty(obj, "orderBy", { 
        configurable: false, // 是否可配置
        enumerable: false, // 是否可迭代
        writable: false, // 是否可写
        value: function (key, order) { 
          obj.sort((a, b) => { 
            if (order == "desc") { 
              return b[key] - a[key];
            } else { 
              return a[key] - b[key];
            }
          });
          return find(obj);
        },
      });
    
      return obj;
    };
    
    // 查找 data 中，符合条件的数据，并进行排序
    const result = find(data)
      .where({ 
        title: /\d$/,
      })
      .orderBy("userId", "desc");
    
    const result1 = find(data).orderBy("userId", "asc").where({ 
      title: /\d$/,
    });
    
    console.log(result); // [ { userId: 19, title: 'title2' }, { userId: 8, title: 'title1' } ]
    console.log(result1); // [ { userId: 8, title: 'title1' }, { userId: 19, title: 'title2' } ]

发表评论取消回复

表情：

评论列表（有 0 条评论，223人围观）

还没有评论，来说两句吧...

相关阅读

相关 java经典笔试题大全(50道含答案)

java经典笔试题大全(50道含答案) 整理了一套常用的Java笔试题，选择题50道，简答题5道，试试你能做对多少题吧，含答案。选择题(共5

叁歲伎倆/ 2023年09月23日 17:23/ 0 赞/ 160 阅读

相关 2021前端面试笔试题及答案

更多面试题已在小程序更新 WX搜索【MST题库】小程序查看 ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_sha

傷城~/ 2023年03月01日 10:24/ 0 赞/ 46 阅读

相关几道笔试题

1.cookie和session的作用以及他们的应用场合 2.怎样让jvm加载一个Class的同时执行一段代码 3.post和get区别

朱雀/ 2022年09月18日 14:45/ 0 赞/ 260 阅读

相关阿里钉钉前端170+道面试题及答案分享

点击上方前端Q，关注公众号回复加群，加入前端Q技术交流群前言最近用团队的账号发了一篇文章专有钉钉前端面试指南\[1\]，初衷是希望给大家传递一些可能没有

一时失言乱红尘/ 2022年09月14日 00:24/ 0 赞/ 311 阅读

相关分享两道阿里前端笔试题（附答案）

1. 实现一个简单的模板渲染，给定一个模板和一个对象，利用对象中的数据生成模板字符串，并返回最终结果。 function renderTpl(tpl, data)

￡神魔★判官ぃ/ 2022年09月10日 03:18/ 0 赞/ 224 阅读

相关前端外包笔试题——答案解析

今天看到技术交流群里，有人发了一套前端外包的笔试题。好久都没有做过面试题了。今天一看，果然一脸懵。现在把题目和答案记录一下，多多记录，收货多多。 1.`js`判断变量是

古城微笑少年丶/ 2022年08月29日 10:47/ 0 赞/ 269 阅读

相关程序员笔试题（附答案）

最近一直在找工作，经历了一些笔试，凭记忆把它们记下了，现在把答案整理出来，大家一块学习（1）Overload和Override的区别方法的重写Overrid

落日映苍穹つ/ 2022年04月01日 11:22/ 0 赞/ 318 阅读

相关北京某公司前端笔试题及其答案

![在这里插入图片描述][20190303102036442.png] ![在这里插入图片描述][20190303103057329.png] ![在这里插入图片描述]

朱雀/ 2022年03月15日 14:20/ 0 赞/ 264 阅读

相关前端笔试题

原题来自: javascript-puzzlers（http://javascript-puzzlers.herokuapp.com/）读者可以先去做一下感受感受.

男娘i/ 2021年09月14日 11:46/ 0 赞/ 494 阅读

相关分享 100 道 Linux 笔试题

点击上方，选择设为星标技术博文，及时送达 ![640?wx\_fmt=jpeg][640_wx_fmt_jpeg] 作者：PassZhang 原文：cnblogs.

柔光的暖阳◎/ 2021年07月31日 17:07/ 0 赞/ 650 阅读