前端面试题精讲-优快云博客

本文链接：https://blog.youkuaiyun.com/hell0__kitty/article/details/51234556

nice问的问题主要有

css3

1.1

动画、渐变

1.2

元素定高和不定高的水平垂直居中

1.3

canvas画布问题

2.HTML5
列表显示，item定宽，又有外边距，如何保证一行三列。ps（其实我后来想了想，这也是变相问我boostrap栅栏布局的实现吧）。

3.Jquery

3.1

delegate和on的异同

3.2

Ajax跨越请求，Jsonp的原理，除jsonp外还有哪些跨越方法

3.3

attr和prop的区别

4.Less，grunt
因为简历中提到过LESS,问了我less,grunt如果预编译的

5.js

5.1

问了下是否有模块化开发经验

5.2

继承的原理

5.3

1.2+1.4 == 2.6 //false

由于数字在计算机中以二进制方式存储，所以1.2+1.4 的值为2.59999999 ，并不等于2.6

转自JavaScript 中的相等性判断
判等列表

总结下内心的心路历程吧，nice的工作环境和发展方向都是我很喜欢的，而且当天问的问题都是基础题。但是当天状况多多，各种迷路再加上担心下午上班（是的，很不厚道的吃着碗里的看着锅里的），迟到了半个小时整个人都是不好的，所以很多题意外又不意外的失误了，很是遗憾，和nice擦肩而过。太笨了

另附上当时的几道小题，考察的是js的函数作用域的变量提升问题， this和原型链三个知识点
Q1：函数变量提升

function test() {
            console.log(a);
            console.log(b());
            var a = 1;
            function b() {
                return 2;
            }
        }
        test();
        ----输出 undifined , 2

简单解释下，js函数内部，变量声明提升到函数顶部，但是赋值部分不会随着变量提升。所以相当于进入函数内部时，已经有了var a, var b了。and, b是函数声明, 函数体随之也会提升到函数顶部。
另外多说点：
js是没有块级作用域的，它不会像c, c++那样，{} 保护变量的作用域，js是以函数为作用域的。函数内部可以访问到外部的作用域，函数外部却无法访问函数内部作用域的。

Q2：this

var name = '北京';
        var obj = {
            name: '上海',
            prop: {
                name: '天津',
                getName: function() {
                    return this.name;
                }
            }

        }
        console.log(obj.prop.getName());
        var test = obj.prop.getName;
        test();
                ----这里输出天津，北京

this代表正在执行的环境，第一个输出时: 当前所在环境this值为obj.prop,所以返回的name为天津。
第二个输出时：当前所在的环境this 是全局变量，所以name 值为北京。
那么如何修改test的this值，让它也同样输出天津呢，我们可以采用bind（）方法，改变this的指向：

var name = '北京';
        var obj = {
            name: '上海',
            prop: {
                name: '天津',
                getName: function() {
                    return this.name;
                }
            }

        }
        console.log(obj.prop.getName());
        var test = obj.prop.getName.bind(obj.prop);
        test();
        -----此时，输出的结果为 天津，天津

Q3：原型链

        Object.prototype.bar = 1;
        var foo = {goo: undefined};
        console.log(foo.bar);
        console.log('bar' in foo);
        console.log(foo.hasOwnProperty('bar'));
        console.log(foo.hasOwnProperty('goo'));
        ![结果](http://img.blog.youkuaiyun.com/20160424180709167)

原型链就是通过一个对象实例指向另一个构造函数的原型来实现的，这也是一种常用的继承方法。查找属性首先从实例本身查找，然后在原型链上查找。同名属性情况下，自身属性会覆盖链上其他的同名属性，当删除了自身的属性时，才会显示链上的属性。通过hasOwnProperty() 方法可以判断一个属性是否是该对象自身上的属性。

6 基本数据类型
number，string, boolean, null, undefined, obeject, array, function.
array和function是特殊的对象类型

7 typeof
使用typeof 判断数据类型可得到的结果有：
number, string, boolean, undefined, obeject, function, typeof(null)得到的结果为 object。

8 toString
原始的Object对象 toString 方法得到的结果是[object 数据类型]，可以通过这种方法获取数据的实际类型。面试的时候遇到这样一道题：

 输出：abc+[1,2,3]

结果应该是 abc1,2,3
这是因为Array的toString 方法覆盖了原生的方法，数组类的toString()方法将每个元素转化为字符串，并在元素之间添加逗号合并成结果字符串。function类的toString()方法返回这个函数的实现定义的表示方式。日期类返回了一个可读的日期和时间字符串。（–出自大犀牛）。这些小坑要注意。

9 es6
10 react