Linkedin 前端工程师 电面面经

面试时间：2016-7-12

面试结果：跪

自己平时做Fullstack， 前端后端都有接触，主要用AngularJS，所以很少直接操作DOM，利用这次面试机会饿补了一下DOM的相关知识，但是基础还是欠缺，像上面这几道题还是没有答的非常流利。另外我工作中是不用JQuery的，也没有时间特地准备，但是通过面试了解到，Linkedin的还是用很多JQuery，因为写DOM原生程序，面试官说他对原生DOM操作也不是很熟，然后就在他的误导下写了一个和JQuery杂交的程序，就是下面让我写append一个array到dom节点上。后来面试之后在codepen上自己测了一下，才知道他给我的方法是JQuery独有的，DOM根本没法直接插一个Array到DOM上。而且之后他还让我对比一个一个的append元素和append一个array的区别，哪个好，因为当时并不知道这个是JQuery上独有的，所以从时间空间复杂度上做了回答。他又有所补充，说每次如果一个一个的append元素，那么每次都要定位它将要插入的位置，而后者不用，所以省时间。我对他的补充提出了质疑，说我已经在程序外边定位了parent dom，为什么每次还是要找，而且Array的长度是一致，循环的次数也不是一样多？之后他又尝试解释了一下，但是我并不觉得解释到了点子上。事后我专门做了测试，JQuery确实append一个array的话会比一个一个append快，但是和我最开始写的原生DOM方法比，这两个都慢了起码一倍，具体为什么快，我觉得可能面试官的解释有一定的道理，但是这完全是基于对一个第三方Library的了解，并不具备普遍意义。

总体感觉Linkedin某些前端面试官水平挺一般的，但是自己连电面都没过去，也说明自己挺菜的。总之还是继续刷题，继续找吧。大家好运！

另外一个细节，就是之前他们给我发邮件安排一个男的面我，然后面试的时候突然换人，也没有任何解释。我觉得一个专注职业社交的网站，能把面试安排的如此混乱，实在让我大跌眼镜。

基础题：

1. How to improve the accessibility of a website?

2. Explain event bubbling? Why it is a good approach?

3. Ways to add addtional stylesheets on bootstrap?

4. Why a css preprocessor such as LESS is better than traditional css?

以下代码是Markdown写的，可以到我自己的网站看编排好的版本。

### 题目一： 看代码猜结果

```javascript

var Foo = function(a) {

  // This function is not defined.

  // Either window or this doesn't have this method.

  function bar() {   

    console.log(a);

  };

  var a = 1;

  // This function is defined and is assigned to `this` Object only.

  // So the function can be accessed from a new created instance.

  // parameter a is accessible from all the nested function defined here.

  this.baz = function() {

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

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

t;></div>

// Question: insert links for each of the members into the content div

// The link would be like the example below

<a href="profile.jsp?id=<memeber.id>"><member.name></a>

var contentEl = document.getElementById("content");

var htmlC = [];

members.forEach(function(memeber){

    var name = member.name;

    var id = member.id;

    var link = "profile.jsp?id=" + id;

    var aEl = doucment.createElement('a');

    aEl.setAttribute('href', link);

    aEl.innerText = name;

    htmlC.push(aEl);

});

contentEl.append(htmlC);

// Follow up question:

What the benefits you can get by inserting them at once rather than inserting it each time you create a anchor tag?

//

```

f.baz(); 应该是1 吧？

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

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

huozicheng 发表于 2016-9-12 11:49
f.baz(); 应该是1 吧？

我觉得也是1， 在 这个新创建的scope 里面，定义了一个变量a， 所以在 baz这个函数的closure 里面，a refer的就是这个局部变量 a， 而不是Foo传进来的params a . 所以应该是1.

好像发错版， 如属实，麻烦请帮忙转移以下。

好厉害 好全！

求加楼主微信

谢谢lz分享

感谢lz！！！

jQuery append array比较快的原因应该是jQuery内部预先处理了array里面的元素，所以总体只做一次DOM manipulate。
然而一个一个append 元素的话， 每次append都要做DOM manipulate，所以就会慢。 DOM的操作很昂贵。

huozicheng 发表于 2016-9-12 11:49
f.baz(); 应该是1 吧？

不好意思， 是我写错了

seaskymonster 发表于 2016-9-13 05:11
我觉得也是1， 在 这个新创建的scope 里面，定义了一个变量a， 所以在 baz这个函数的closure 里面，a ref ...

不好意思，是我写错了