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

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' } ]