用面试题，复习一下，js基础。

1、综合题

  1. function Foo() {
  2.     getName = function () { alert (1); };
  3.     return this;
  4. }
  5. Foo.getName = function () { alert (2);};
  6. Foo.prototype.getName = function () { alert (3);};
  7. var getName = function () { alert (4);};
  8. function getName() { alert (5);}
  10. //答案：
  11. Foo.getName();//2
  12. getName();//4   因为变量提升与函数表达式，4会覆盖5
  14. ---
  15.     区别在于 var getName 是函数表达式，而 function getName 是函数声明
  16.     函数表达式最大的问题，在于js会将此代码拆分为两行代码分别执行
  17.     console.log(x);//输出：function x(){}
  18.     var x=1;
  19.     function x(){}
  20.     ------------------------------------
  21.     var x;
  22.     function x(){}
  23.     console.log(x);
  24.     x=1;
  26. ---
  28. Foo().getName();//1  1覆盖4，返回this，指向的是window ===window.getName
  29. getName();//1   window.getName
  30. new Foo.getName();//2   ne(Foo.getName)();
  31.                         //将getName函数作为了构造函数来执行
  32. new Foo().getName();//3 点（.）的优先级高于new操作  (new Foo()).getName()
  33.                     //返回this，指向new，实例的getName 是protitype
  34. new new Foo().getName();//3  new ((new Foo()).getName)();
  36. -----------------------------------------------------------------------------
  37. var name = 'World!';
  38. (function () {
  39.     if (typeof name === 'undefined') {
  40.         var name = 'Jack';
  41.         console.log('Goodbye ' + name);
  42.     } else {
  43.         console.log('Hello ' + name);
  44.     }
  45. })();
  46. ------------------------------
  47.  变量声明提前，在 JavaScript中， functions 和 variables 会被提升。
  48.  变量提升是JavaScript将声明移至作用域 scope (全局域或者当前函数作用域) 顶部的行为。
  49.     此题相当于：
  50.     var name = 'World!';
  51.     (function () {
  52.         var name;
  53.         if (typeof name === 'undefined') {
  54.             name = 'Jack';
  55.             console.log('Goodbye ' + name);
  56.         } else {
  57.             console.log('Hello ' + name);
  58.         }
  59.     })();
  60. 所以结果是：Goodbye Jack

2、使用 typeof bar === "object" 判断 bar 是不是一个对象有神马潜在的弊端？如何避免这种弊端？

使用 typeof 的弊端是显而易见的(这种弊端同使用 instanceof)：

  1. let obj = {};
  2. let arr = [];
  4. console.log(typeof obj === 'object');  //true
  5. console.log(typeof arr === 'object');  //true
  6. console.log(typeof null === 'object');  //true
  7. 从上面的输出结果可知，typeof bar === "object" 并不能准确判断 bar 就是一个 Object。可以通过 Object.prototype.toString.call(bar) === "[object Object]" 来避免这种弊端：
  9. let obj = {};
  10. let arr = [];
  12. console.log(Object.prototype.toString.call(obj));  //[object Object]
  13. console.log(Object.prototype.toString.call(arr));  //[object Array]
  14. console.log(Object.prototype.toString.call(null));  //[object Null]
  15. 另外，为了珍爱生命，请远离 ==：
  16. 珍爱生命
  18. 而 [] === false 是返回 false 的。

3、下面的代码会在 console 输出神马？为什么？

  1. (function(){
  2.   var a = b = 3;
  3. })();
  5. console.log("a defined? " + (typeof a !== 'undefined'));
  6. console.log("b defined? " + (typeof b !== 'undefined'));
  7. 这跟变量作用域有关，输出换成下面的：
  9. console.log(b); //3
  10. console,log(typeof a); //undefined
  11. 拆解一下自执行函数中的变量赋值：
  13. b = 3;
  14. var a = b;
  15. 所以 b 成了全局变量，而 a 是自执行函数的一个局部变量。
  16. a defined? false
  17. b defined? true

4、下面的代码会在 console 输出神马？为什么？

  1. var myObject = {
  2.     foo: "bar",
  3.     func: function() {
  4.         var self = this;
  5.         console.log("outer func:  this.foo = " + this.foo);
  6.         console.log("outer func:  self.foo = " + self.foo);
  7.         (function() {
  8.             console.log("inner func:  this.foo = " + this.foo);
  9.             console.log("inner func:  self.foo = " + self.foo);
  10.         }());
  11.     }
  12. };
  13. myObject.func();
  14. 第一个和第二个的输出不难判断，在 ES6 之前，JavaScript 只有函数作用域，所以 func 中的 IIFE 有自己的独立作用域，并且它能访问到外部作用域中的 self，所以第三个输出会报错，因为 this 在可访问到的作用域内是 undefined，第四个输出是 bar。如果你知道闭包，也很容易解决的：
  16. (function(test) {
  17.             console.log("inner func:  this.foo = " + test.foo);  //'bar'
  18.             console.log("inner func:  self.foo = " + self.foo);
  19. }(self));
  20. outer func:  this.foo = bar
  21. outer func:  self.foo = bar
  22. inner func:  this.foo = undefined
  23. inner func:  self.foo = bar

5、将 JavaScript代码包含在一个函数块中有神马意思呢？为什么要这么做？

  1. 换句话说，为什么要用立即执行函数表达式（Immediately-Invoked Function Expression）。
  2. 闭包在函数化编程中也是经常用到，比如函数柯里化。部分应用
  4. IIFE 有两个比较经典的使用场景，一是类似于在循环中定时输出数据项，二是类似于 JQuery/Node 的插件和模块开发。
  6. for(var i = 0; i < 5; i++) {
  7.     setTimeout(function() {
  8.         console.log(i);
  9.     }, 1000);
  10. }
  11. 上面的输出并不是你以为的0，1，2，3，4，而输出的全部是5，这时 IIFE 就能有用了：
  13. for(var i = 0; i < 5; i++) {
  14.     (function(i) {
  15.       setTimeout(function() {
  16.         console.log(i);
  17.       }, 1000);
  18.     })(i)
  19. }
  20. 而在 JQuery/Node 的插件和模块开发中，为避免变量污染，也是一个大大的 IIFE：
  22. (function($) {
  23.         //代码
  24.  } )(jQuery);

6、在严格模式('use strict')下进行 JavaScript 开发有神马好处？

  1. 消除Javascript语法的一些不合理、不严谨之处，减少一些怪异行为;
  2. 消除代码运行的一些不安全之处，保证代码运行的安全；
  3. 提高编译器效率，增加运行速度；
  4. 为未来新版本的Javascript做好铺垫。

7、下面两个函数的返回值是一样的吗？为什么？

  1. function foo1()
  2. {
  3.   return {
  4.       bar: "hello"
  5.   };
  6. }
  8. function foo2()
  9. {
  10.   return
  11.   {
  12.       bar: "hello"
  13.   };
  14. }
  15. 在编程语言中，基本都是使用分号（;）将语句分隔开，这可以增加代码的可读性和整洁性。而在JS中，如若语句各占独立一行，通常可以省略语句间的分号（;），JS 解析器会根据能否正常编译来决定是否自动填充分号：
  17. var test = 1 +
  18. 2
  19. console.log(test);  //3
  20. 在上述情况下，为了正确解析代码，就不会自动填充分号了，但是对于 return 、break、continue 等语句，如果后面紧跟换行，解析器一定会自动在后面填充分号(;)，所以上面的第二个函数就变成了这样：
  22. function foo2()
  23. {
  24.   return;
  25.   {
  26.       bar: "hello"
  27.   };
  28. }
  29. 所以第二个函数是返回 undefined。

8、神马是 NaN，它的类型是神马？怎么测试一个值是否等于 NaN?

  1. NaN 是 Not a Number 的缩写，JavaScript 的一种特殊数值，其类型是 Number，不是一个数字同时自己不等于自己，可以通过 isNaN(param) 来判断一个值是否是 NaN：
  3. console.log(isNaN(NaN)); //true
  4. console.log(isNaN(23)); //false
  5. console.log(isNaN('ds')); //true
  6. console.log(isNaN('32131sdasd')); //true
  7. console.log(NaN === NaN); //false
  8. console.log(NaN === undefined); //false
  9. console.log(undefined === undefined); //false
  10. console.log(typeof NaN); //number
  11. console.log(Object.prototype.toString.call(NaN)); //[object Number]
  12. ES6 中，isNaN() 成为了 Number 的静态方法：Number.isNaN().

9、解释一下下面代码的输出

  1. console.log(0.1 + 0.2);   //0.30000000000000004
  2. console.log(0.1 + 0.2 == 0.3);  //false
  3. JavaScript 中的 number 类型就是浮点型，JavaScript 中的浮点数采用IEEE-754 格式的规定，这是一种二进制表示法，可以精确地表示分数，比如1/2，1/8，1/1024，每个浮点数占64位。但是，二进制浮点数表示法并不能精确的表示类似0.1这样 的简单的数字，会有舍入误差。
  5. 由于采用二进制，JavaScript 也不能有限表示 1/10、1/2 等这样的分数。在二进制中，1/10(0.1)被表示为 0.00110011001100110011…… 注意 0011 是无限重复的，这是舍入误差造成的，所以对于 0.1 + 0.2 这样的运算，操作数会先被转成二进制，然后再计算：
  7. 0.1 => 0.0001 1001 1001 1001…（无限循环）
  8. 0.2 => 0.0011 0011 0011 0011…（无限循环）
  9. 双精度浮点数的小数部分最多支持 52 位，所以两者相加之后得到这么一串 0.0100110011001100110011001100110011001100...因浮点数小数位的限制而截断的二进制数字，这时候，再把它转换为十进制，就成了 0.30000000000000004。
  11. 对于保证浮点数计算的正确性，有两种常见方式。
  13. 一是先升幂再降幂：
  15. function add(num1, num2){
  16.   let r1, r2, m;
  17.   r1 = (''+num1).split('.')[1].length;
  18.   r2 = (''+num2).split('.')[1].length;
  20.   m = Math.pow(10,Math.max(r1,r2));
  21.   return (num1 * m + num2 * m) / m;
  22. }
  23. console.log(add(0.1,0.2));   //0.3
  24. console.log(add(0.15,0.2256)); //0.3756
  25. 二是是使用内置的 toPrecision() 和 toFixed() 方法，注意，方法的返回值字符串。
  27. function add(x, y) {
  28.     return x.toPrecision() + y.toPrecision()
  29. }
  30. console.log(add(0.1,0.2));  //"0.10.2"

10、实现函数 isInteger(x) 来判断 x 是否是整数

  1. 可以将 x 转换成10进制，判断和本身是不是相等即可：
  3. function isInteger(x) {
  4.     return parseInt(x, 10) === x;
  5. }
  6. ES6 对数值进行了扩展，提供了静态方法 isInteger() 来判断参数是否是整数：
  8. Number.isInteger(25) // true
  9. Number.isInteger(25.0) // true
  10. Number.isInteger(25.1) // false
  11. Number.isInteger("15") // false
  12. Number.isInteger(true) // false
  13. JavaScript能够准确表示的整数范围在 -2^53 到 2^53 之间（不含两个端点），超过这个范围，无法精确表示这个值。ES6 引入了Number.MAX_SAFE_INTEGER 和 Number.MIN_SAFE_INTEGER这两个常量，用来表示这个范围的上下限，并提供了 Number.isSafeInteger() 来判断整数是否是安全型整数。

11、在下面的代码中，数字 1-4 会以什么顺序输出？为什么会这样输出？

  1. (function() {
  2.     console.log(1);
  3.     setTimeout(function(){console.log(2)}, 1000);
  4.     setTimeout(function(){console.log(3)}, 0);
  5.     console.log(4);
  6. })();
  7. 这个就不多解释了，主要是 JavaScript 的定时机制和时间循环，不要忘了，JavaScript 是单线程的。详解可以参考 从setTimeout谈JavaScript运行机制。
  8. 1432

12、写一个少于 80 字符的函数，判断一个字符串是不是回文字符串

  1. function isPalindrome(str) {
  2.     str = str.replace(/\W/g, '').toLowerCase();
  3.     return (str == str.split('').reverse().join(''));
  4. }

13、写一个按照下面方式调用都能正常工作的 sum 方法

  1. console.log(sum(2,3));   // Outputs 5
  2. console.log(sum(2)(3));  // Outputs 5
  3. 针对这个题，可以判断参数个数来实现：
  5. function sum() {
  6.   var fir = arguments[0];
  7.   if(arguments.length === 2) {
  8.     return arguments[0] + arguments[1]
  9.   } else {
  10.     return function(sec) {
  11.        return fir + sec;
  12.     }
  13.   }
  15. }

14、根据下面的代码片段回答后面的问题

  1. for (var i = 0; i < 5; i++) {
  2.   var btn = document.createElement('button');
  3.   btn.appendChild(document.createTextNode('Button ' + i));
  4.   btn.addEventListener('click', function(){ console.log(i); });
  5.   document.body.appendChild(btn);
  6. }
  7. 1、点击 Button 4，会在控制台输出什么？
  8. 2、给出一种符合预期的实现方式
  10. 1、点击5个按钮中的任意一个，都是输出5
  11. 2、参考 IIFE。

15、下面的代码会输出什么？为什么？

  1. var arr1 = "john".split(''); j o h n
  2. var arr2 = arr1.reverse(); n h o j
  3. var arr3 = "jones".split(''); j o n e s
  4. arr2.push(arr3);
  5. console.log("array 1: length=" + arr1.length + " last=" + arr1.slice(-1));
  6. console.log("array 2: length=" + arr2.length + " last=" + arr2.slice(-1));
  7. 会输出什么呢？你运行下就知道了，可能会在你的意料之外。
  9. MDN 上对于 reverse() 的描述是酱紫的：
  11. Description
  12. The reverse method transposes the elements of the calling array object in place, mutating the array, and returning a reference to the array.
  13. reverse() 会改变数组本身，并返回原数组的引用。
  15. array 1: length=5 last=j,o,n,e,s
  16. array 2: length=5 last=j,o,n,e,s

16、下面的代码会输出什么？为什么？

  1. console.log(1 +  "2" + "2"); //122
  2. console.log(1 +  +"2" + "2"); //32
  3. console.log(1 +  -"1" + "2"); //02
  4. console.log(+"1" +  "1" + "2"); //112
  5. console.log( "A" - "B" + "2"); //NaN2
  6. console.log( "A" - "B" + 2); //NaN
  7. 输出什么，自己去运行吧，需要注意三个点：
  9. 多个数字和数字字符串混合运算时，跟操作数的位置有关
  10. console.log(2 + 1 + '3'); / /‘33’
  11. console.log('3' + 2 + 1); //'321'
  12. 数字字符串之前存在数字中的正负号(+/-)时，会被转换成数字
  13. console.log(typeof '3');   // string
  14. console.log(typeof +'3');  //number
  15. 同样，可以在数字前添加 ''，将数字转为字符串
  17. console.log(typeof 3);   // number
  18. console.log(typeof (''+3));  //string
  19. 对于运算结果不能转换成数字的，将返回 NaN
  20. console.log('a' * 'sd');   //NaN
  21. console.log('A' - 'B');  // NaN

17、如果 list 很大，下面的这段递归代码会造成堆栈溢出。如果在不改变递归模式的前提下修善这段代码？

  1. var list = readHugeList();
  3. var nextListItem = function() {
  4.     var item = list.pop();
  6.     if (item) {
  7.         // process the list item...
  8.         nextListItem();
  9.     }
  10. };
  11. 原文上的解决方式是加个定时器：
  13. var list = readHugeList();
  15. var nextListItem = function() {
  16.     var item = list.pop();
  18.     if (item) {
  19.         // process the list item...
  20.         setTimeout( nextListItem, 0);
  21.     }
  22. };
  23. 解决方式的原理请参考第10题。

18、什么是闭包？举例说明

  1. 函数返回函数
  2. 函数记住并访问其所在的词法作用域，叫做闭包现象，而此时函数对作用域的引用叫做闭包

19、解释下列代码的输出

  1. console.log("0 || 1 = "+(0 || 1));
  2. console.log("1 || 2 = "+(1 || 2));
  3. console.log("0 && 1 = "+(0 && 1));
  4. console.log("1 && 2 = "+(1 && 2));
  5. 逻辑与和逻辑或运算符会返回一个值，并且二者都是短路运算符：
  7. 逻辑与返回第一个是 false 的操作数 或者 最后一个是 true的操作数
  8. console.log(1 && 2 && 0);  //0
  9. console.log(1 && 0 && 1);  //0
  10. console.log(1 && 2 && 3);  //3
  11. 如果某个操作数为 false，则该操作数之后的操作数都不会被计算
  13. 逻辑或返回第一个是 true 的操作数 或者 最后一个是 false的操作数
  14. console.log(1 || 2 || 0); //1
  15. console.log(0 || 2 || 1); //2
  16. console.log(0 || 0 || false); //false
  17. 如果某个操作数为 true，则该操作数之后的操作数都不会被计算
  19. 如果逻辑与和逻辑或作混合运算，则逻辑与的优先级高：
  21. console.log(1 && 2 || 0); //2
  22. console.log(0 || 2 && 1); //1
  23. console.log(0 && 2 || 1); //1
  24. 在 JavaScript，常见的 false 值：
  26. 0, '0', +0, -0, false, '',null,undefined,null,NaN
  27. 要注意空数组([])和空对象({}):
  29. console.log([] == false) //true
  30. console.log({} == false) //false
  31. console.log(Boolean([])) //true
  32. console.log(Boolean({})) //true
  33. 所以在 if 中，[] 和 {} 都表现为 true：

20、解释下面代码的输出

  1. console.log(false == '0') //true
  2. console.log(false === '0') //false

21、解释下面代码的输出

  1. var a={},
  2.     b={key:'b'},
  3.     c={key:'c'};
  5. a[b]=123;
  6. a[c]=456;
  8. console.log(a[b]);
  9. 输出是 456，参考原文的解释：
  11. The reason for this is as follows: When setting an object property, JavaScript will implicitly stringify the parameter value. In this case, since b and c are both objects, they will both be converted to "[object Object]". As a result, a[b] anda[c] are both equivalent to a["[object Object]"] and can be used interchangeably. Therefore, setting or referencing a[c] is precisely the same as setting or referencing a[b].

22、解释下面代码的输出

  1. console.log((function f(n){return ((n > 1) ? n * f(n-1) : n)})(10));
  2. 结果是10的阶乘。这是一个递归调用，为了简化，我初始化 n=5，则调用链和返回链如下：
  4. 递归

23、解释下面代码的输出

  1. (function(x) {
  2.     return (function(y) {
  3.         console.log(x);
  4.     })(2)
  5. })(1);
  6. 输出1，闭包能够访问外部作用域的变量或参数。

24、解释下面代码的输出，并修复存在的问题

  1. var hero = {
  2.     _name: 'John Doe',
  3.     getSecretIdentity: function (){
  4.         return this._name;
  5.     }
  6. };
  8. var stoleSecretIdentity = hero.getSecretIdentity;
  10. console.log(stoleSecretIdentity());
  11. console.log(hero.getSecretIdentity());
  12. 将 getSecretIdentity 赋给 stoleSecretIdentity，等价于定义了 stoleSecretIdentity 函数：
  14. var stoleSecretIdentity =  function (){
  15.         return this._name;
  16. }
  17. stoleSecretIdentity 的上下文是全局环境，所以第一个输出 undefined。若要输出 John Doe，则要通过 call 、apply 和 bind 等方式改变 stoleSecretIdentity 的this 指向(hero)。
  19. 第二个是调用对象的方法，输出 John Doe。

25、给你一个 DOM 元素，创建一个能访问该元素所有子元素的函数，并且要将每个子元素传递给指定的回调函数。

  1. 函数接受两个参数：
  3. DOM
  4. 指定的回调函数
  5. 原文利用 深度优先搜索(Depth-First-Search) 给了一个实现：
  7. function Traverse(p_element,p_callback) {
  8.    p_callback(p_element);
  9.    var list = p_element.children;
  10.    for (var i = 0; i < list.length; i++) {
  11.        Traverse(list[i],p_callback);  // recursive call
  12.    }
  13. }

26 小题

  1. var foo = 1;
  2. function bar() {
  3.     foo = 10;
  4.     return;
  5.     function foo() {}
  6. }
  7. bar();
  8. console.log(foo); //1
  9. ---------------------------------
  10. var foo = {n:1};
  11. var bar = foo;
  12. foo.x = foo = {n:2};
  13. console.log(foo.x);
  14. console.log(bar.x);
  16. undefined
  17. Object {n: 2}
  19. --------------------------------
  20. var fullname = 'John Doe';
  21. var obj = {
  22.    fullname: 'Colin Ihrig',
  23.    prop: {
  24.       fullname: 'Aurelio De Rosa',
  25.       getFullname: function() {
  26.          return this.fullname;
  27.       }
  28.    }
  29. };
  30. console.log(obj.prop.getFullname());
  32. var test = obj.prop.getFullname;
  34. console.log(test());
  35. Aurelio De Rosa
  36. John Doe
  38. ------------------------------------
  39. var a = new Object();
  40. a.value = 1;
  41. b = a;
  42. b.value = 2;
  43. alert(a.value); //2   
  45. ------------------------------------
  46. var scope = 'top';
  47. var f1 = function() {
  48.     console.log(scope);
  49. };
  50. var f2 = function() {
  51.     var scope = 'f2';
  52.     f1();
  53. };
  54. f2();
  55.  top

27、下面这个ul，如何点击每一列的时候alert其index


  2. // 方法一：
  3. var lis=document.getElementById('2223').getElementsByTagName('li');
  4. for(var i=0;i<3;i++)
  5. {
  6.     lis[i].index=i;
  7.     lis[i].onclick=function(){
  8.         alert(this.index);
  9.     };
  10. }
  12. //方法二：
  13. var lis=document.getElementById('2223').getElementsByTagName('li');
  14. for(var i=0;i<3;i++)
  15. {
  16.     lis[i].onclick=(function(a){
  17.         return function() {
  18.             alert(a);
  19.         }
  20.     })(i);
  21. }

28、数组去重

  1. var arr = [1,3,1,2,3,4,55,23,4,23,2];
  2.         function uniquueArr(arr) {
  3.             var obj = {},
  4.                 arr1 = [];
  5.             for(var i=0,len = arr.length; i<len; i++) {
  6.                 if( !obj[arr[i]] ) {
  7.                     obj[arr[i]] = true;
  8.                     arr1.push(arr[i]);
  9.                 }
  10.             }
  11.             return arr1;
  12.         }
  13.         console.log(uniquueArr(arr));
  14.         -----------------------------------------
  15.         let unique = function(array){
  16.           return [...new Set(array)];
  17.         }
  18.         ------------------------------------------
  19.         let unique = function (array) {
  20.             let ro = {};
  21.             let ra = [];
  22.             array.forEach(item=>{
  23.                 if(!ro[item]){
  24.                     ro[item] = item;
  25.                     ra.push(item);
  26.                 }
  27.             });
  28.             return ra;
  29.         }

29、找出一个字符串里面出现最多个数的字符

  1. var str='dasdasdadsssssaaaaaaaaaaaaa';
  2.         function maxCode(str) {
  3.             var obj = {},
  4.                 index = 0,
  5.                 max = 0;
  6.             for(var i=0,len = str.length; i<len; i++) {
  7.                 if( !obj[str.charAt(i)] ) {
  8.                     obj[str.charAt(i)] = 1;
  9.                 } else {
  10.                     obj[str.charAt(i)] ++;
  11.                 }
  12.             }
  13.             for(var i in obj){
  14.                 if(obj[i] > max) {
  15.                     index = i;
  16.                     max = obj[index];
  17.                 }
  18.             }
  19.             return {
  20.                 index :index,
  21.                 max : max
  22.             }
  23.         }
  24.         console.log(maxCode(str));
  26. ----------------------------------------------------------------
  27. let countChar = function countChar(str){
  28.     let ro = {};
  29.     for(let c of str){
  30.         if(!ro[c]){
  31.             ro[c] = 1;
  32.         }else{
  33.             ro[c] ++;
  34.         }
  35.     }
  36.     return ro;
  37. }
  38. ------------------------------------------------------------------
  39. let countChar = function countChar(str){
  40.     return Array.prototype.reduce.call(str,function(pre,current){
  41.         if(pre[current]){
  42.             pre[current] ++;
  43.         }else{
  44.             pre[current ] = 1;
  45.         }
  46.         return pre;
  47.     },{});
  48. }
  49. -------------------------------------------------------------------
  50. let findMaxDuplicateChar = function (str){
  51.   let chars = countChar(str);
  52.   let max = 0;
  53.   let char = null;
  54.   for(let c in chars){
  55.     if(chars[c] > max){
  56.       max = chars[c];
  57.       char = c;
  58.     }
  59.   }
  60.   return char;
  61. }

30、this指向问题

  1. function A() {
  2.             this.name = 'lvdaofeng';
  3.             return 'wangdaming';
  4.         };
  5.         var a = new A();
  6.         console.log(a.name);
  7.         function B() {
  8.             this.name = 'chengli';
  9.             return {
  10.                 name : 'dapang'
  11.             }
  12.         }
  13.         var b = new B();
  14.         console.log(b.name);
  15. lvdaofeng   指向的new
  16. dapang

31、函数编程的题

  1. var test = ( function(a) {
  2.     this.a = a;
  3.     return function(b) {
  4.         return this.a+ b;
  5.     }
  6. })( (function(a, b){
  7.     return a
  8. })(1,2) );
  9. console.log(test(4));
  10. 5

32、原型链与原型链

  1. var a = 1;
  2.         console.log(a.__proto__);//Number
  3.         console.log(a.__proto__.__proto__);//Object
  4.         console.log(a.__proto__.__proto__.__proto__);//null
  5.         console.log(a.prototype);//undefined
  6.         var a = {
  7.             x:1
  8.         };
  9.         console.log(a.__proto__);//Object
  10.         console.log(a.__proto__.__proto__);//null
  11.         console.log(a.prototype);//undefined
  12.         function a() {
  13.             this.y = 2;
  14.         }
  15.         console.log(a.__proto__);//Object
  16.         console.log(a.__proto__.__proto__);//null
  17.         console.log(a);//Object {x: 1}
  18.         var Person = function() {};
  19.         var p = new Person();
  20.         console.log(p.__proto__ );//Object {}
  21.         console.log(Person.prototype);//Object {}
  22. ----------------------------------------------------------
  23. var obj = {
  24.             name:1
  25.         };
  26.         var aa = obj;
  27.         aa.name = 2;
  28.         var bb = obj ;
  29.         bb.name = 3;
  30.         console.log(aa.name);//3
  31.         function Obj() {
  32.             this.name = 1;
  33.         }
  34.         var aa = new Obj();
  35.         aa.name = 2;
  36.         var bb = new Obj();
  37.         bb.name = 3;
  38. -------------------------------------------------------------
  39. function A() {
  40.     this.add1 = function() {
  41.         return ++this.num;
  42.     }
  43. }
  44. A.prototype.num = 1;
  45. var a1 = new A();
  46. var a2 = new A();
  47. console.log(a1.add1());//2
  48. console.log(a2.add1());//2
  50. ---------------------------------------------------------------
  51. function A() {
  52.     this.add1 = function() {
  53.         return ++this.num.x;
  54.     }
  55. }
  56. A.prototype.num = {
  57.     x:1
  58. };
  59. var a1 = new A();
  60. var a2 = new A();
  61. console.log(a1.add1());//2
  62. console.log(a2.add1());//3
  63. --------------------------------------------------------------
  65. Array.isArray( Array.prototype )   //true

33、一些有意思的题

  1. 1、["1", "2", "3"].map(parseInt)   //[1, NaN, NaN]
  2.          *    parseInt的语法：parseInt(string, radix),
  3.          *     string必选。要被解析的字符串
  4.          *     radix可选。解析数字的基数，介于2~36之间，省略或为0则将以10为基数来解析，
  5.                          小于2或大于36 则 parseInt() 将返回 NaN。
  6.          *    return: 解析后的数字
  8.          *    所以本题就是问：
  9.          *    parseInt('1', 0);
  10.          *    parseInt('2', 1);
  11.          *    parseInt('3', 2);
  12.          *
  13.          *  所以结果输出： [1, NaN, NaN]
  14. -----------------------------------------------------------------------------------------
  15. 2、[typeof null, null instanceof Object]
  17.          * 解析：
  18.          *    typeof 返回一个表示类型的字符串
  19.              typeof 的结果请看下面:
  20.              **type**         **result**
  21.              Undefined   "undefined"
  22.              Null        "object"
  23.              Boolean     "boolean"
  24.              Number      "number"
  25.              String      "string"
  26.              Symbol      "symbol"
  27.              Host object Implementation-dependent
  28.              Function    "function"
  29.              Object      "object"
  31.              instanceof 运算符用来检测 constructor.prototype 是否存在于参数 object 的原型链上
  33.              所以输出["object", false]
  34.          *
  35. -----------------------------------------------------------------------------------------------
  36. 3、[ [3,2,1].reduce(Math.pow), [].reduce(Math.pow) ]
  37.     第二个表达式会报异常.
  38.     第一个表达式等价于 Math.pow(3, 2) => 9; Math.pow(9, 1) =>9
  40.     一个error
  41. ----------------------------------------------------------------------------------------------
  42. 4、var val = 'smtg';
  43. console.log('Value is ' + (val === 'smtg') ? 'Something' : 'Nothing');
  44.    + 优先级大于 ?
  45.    此题等价于： 'Value is true' ? 'Something' : 'Nothing'
  46.    所以结果是：'Something'
  48. -----------------------------------------------------------------------------------------------
  49. 5、var END = Math.pow(2, 53);
  50. var START = END - 100;
  51. var count = 0;
  52. for (var i = START; i <= END; i++) {
  53.     count++;
  54. }
  55. console.log(count);
  57. js的精确整数最大为:Math.pow(2,53)-1
  58. 会直接卡死
  60. var a = 111111111111111110000,
  61.     b = 1111;
  62. a + b;//111111111111111110000  超过最大数
  64. -------------------------------------------------------------------------------------------------
  65. 6、var ary = [0,1,2];
  66. ary[10] = 10;
  67. ary.filter(function(x) { return x === undefined;});
  69. var t = Object(this);
  70.     var len = t.length >>> 0;
  71.     if (typeof fun !== 'function') {
  72.       throw new TypeError();
  73.     }
  74.     var res = [];
  75.     var thisArg = arguments.length >= 2 ? arguments[1] : void 0;
  76.     for (var i = 0; i < len; i++) {
  77.       if (i in t) { // 注意这里!!!
  78.         var val = t[i];
  79.         if (fun.call(thisArg, val, i, t)) {
  80.           res.push(val);
  81.         }
  82.       }
  83.     }
  84.     从上面可知filter对数组进行遍历时，会首先检查这个索引值是不是数组的一个属性.测试一下：
  85.     console.info(0 in ary); //true
  86.     console.info(1 in ary); //true
  87.     console.info(4 in ary); //false
  88.     console.info(10 in ary); // false
  89.     也就是说3~9的索引根本没有是初始化
  91.     所以答案：[];
  93.     var ary = Array(3);
  94.     ary[0]=2
  95.     ary.map(function(elem) { return '1'; });
  97.     ["1", undefined × 2]
  99. --------------------------------------------------------------------------------------------
  100. 7、var two   = 0.2
  101. var one   = 0.1
  102. var eight = 0.8
  103. var six   = 0.6
  104. [two - one == one, eight - six == two]
  106. 偶尔会有正确，true,false
  108. ----------------------------------------------------------------------------------------------
  109. 8、function showCase(value) {
  110.     switch(value) {
  111.     case 'A':
  112.         console.log('Case A');
  113.         break;
  114.     case 'B':
  115.         console.log('Case B');
  116.         break;
  117.     case undefined:
  118.         console.log('undefined');
  119.         break;
  120.     default:
  121.         console.log('Do not know!');
  122.     }
  123. }
  124. showCase(new String('A'));   //Do not know!  switch 是===比较
  125. -------------------------------------------------------------------------------------------------
  126. 9、  []==[]  false
  127. /*
  128.     解析： 这题没什么可说的，
  129.     console.info([] instanceof Array); // true
  130.     console.info([] instanceof Object); // true
  131.     []是一个数组对象. [] == [] 等价于：
  132.     var a = [];
  133.     var b = [];
  134.     a == b; 所以肯定是false
  135. */
  136. ----------------------------------------------------------------------------------------------
  137. 10、1 + - + + + - + 1   // 2  等价于  1 + 0-0 +0 +0 + 0- 0+ 1
  138. -----------------------------------------------------------------------------------------------
  139. 11、function sidEffecting(ary) {
  140.   ary[0] = ary[2];
  141. }
  142. function bar(a,b,c) {
  143.   c = 10
  144.   sidEffecting(arguments);
  145.   return a + b + c;
  146. }
  147. bar(1,1,1)   //21
  148. ----------------------------------------------------------------------------------------------
  149. var x = [].reverse;
  150. x();
  151. //window
  152. ----------------------------------------------------------------------------------------------
  153. Number.MIN_VALUE > 0   也是大于0的  true
  154. ----------------------------------------------------------------------------------------------
  155. console.info([1 < 2 < 3, 3 < 2 < 1]);
  156. 解析：
  157.     这个题会让人误以为是 2 > 1 && 2 < 3 其实不是的.
  158.     这个题相当于：
  159.     1 < 2 => true;
  160.     true < 3 => 1 < 3 =>true;
  161.     3 < 2 => false;
  162.     false < 1 => 0 < 1 =>true;
  164.     所以答案是：[true, true]
  165. ------------------------------------------------------------------------------------------------
  166. 2 == [[[2]]]   true
  167. -----------------------------------------------------------------------------------------------
  168. 3.toString()
  169. 3..toString()
  170. 3...toString()
  172. 3.toString() //error
  173. 3..toString() // '3'
  174. 3...toString() // error
  175. var a = 3;
  176. a.toString(); // '3'
  177. -----------------------------------------------------------------------------------------------
  178. var a = /123/,
  179.     b = /123/;
  180. a == b
  181. a === b
  183. 正则表达式不比较
  184. ------------------------------------------------------------------------------------------------
  185. var a = [1, 2, 3],
  186.     b = [1, 2, 3],
  187.     c = [1, 2, 4]
  188. a ==  b
  189. a === b
  190. a >   c
  191. a <   c
  192. false, false, false, true    
  194. 数组不能用=== == 比较但是可以 > < 来比较
  195. ------------------------------------------------------------------------------------------------
  196. var a = {}, b = Object.prototype;
  197. [a.prototype === b, Object.getPrototypeOf(a) === b]
  198.  解析：
  199.     具体的对象没有prototype属性，所以a.prototype是undefined,
  200.     Object.getPrototypeOf(obj) 返回一个具体对象的原型
  202.     答案：false, true
  203. ------------------------------------------------------------------------------------------------
  204. var lowerCaseOnly =  /^[a-z]+$/;
  205. [lowerCaseOnly.test(null), lowerCaseOnly.test()]
  206. ------------------------------------------------------------------------------------------------

34、不用临时变量，交换两个变量的值

  1. function swap(a , b) {
  2.   b = b - a;
  3.   a = a + b;
  4.   b = a - b;
  5.   return [a,b];
  6. }
  7. module.exports = swap;

35、找出数组中最大差值


  2. let getMaxProfit = function getMaxProfit(arr) {
  3.     let max_min = arr.reduce(function(pre,current){
  4.         if(pre.min > current){
  5.             pre.min = current;
  6.         }
  7.         if(pre.max < current){
  8.             pre.max = current;
  9.         }
  10.         return pre;
  11.     },{min:arr[0],max:arr[0]});
  12.     return max_min.max - max_min.min;
  13. }
  14. --------------------------------------------------------------
  15. let getMaxProfit = function getMaxProfit(arr){
  16.     let max = Math.max.apply(Math,arr);
  17.     let min = Math.min.apply(Math,arr);
  18.     return max - min;
  19. }
  20. ---------------------------------------------------------------
  21. let getMaxProfit = function getMaxProfit(arr){
  22.     let max = Math.max(...arr);
  23.     let min = Math.min(...arr);
  24.     return max - min;
  25. }
  26. ----------------------------------------------------------------

前端面试-----JavaScript题的更多相关文章

  1. 前端面试基础题：Ajax原理

    Ajax 的原理简单来说是在⽤户和服务器之间加了—个中间层( AJAX 引擎),通过XmlHttpRequest 对象来向服务器发异步请求,从服务器获得数据,然后⽤ javascrip t 来操作 D ...

  2. WEB前端面试真题 - 2000！大数的阶乘如何计算？

    HTML5学堂-码匠:求某个数字的阶乘,很难吗?看上去这道题异常简单,却不曾想里面暗藏杀机,让不少前端面试的英雄好汉折戟沉沙. 面试真题题目 如何求"大数"的阶乘(如1000的阶乘 ...

  3. 前端面试经典题之apply与call的比较

    在讲apply和call之前,我们需要先清楚在js中,this指向的是什么. 大家可以参考一下阮一峰老师写的关于JavaScript中this的原理讲解文章:http://www.ruanyifeng ...

  4. 前端面试js题

    var a=10; (function(){ console.log(a); var a=100; })(); 结果:输出undefined 解释: function中有var a=100; 声明会提 ...

  5. 前端面试经典题之ES6新特性

    ES6 主要是为了解决 ES5 的先天不足,在原先ES5的基础上新增了许多内容,本篇文章将列举出ES6中新增的10大特性. 一. let 和 const 与var不同,let和const都是用于命名局 ...

  6. 问得最多的十个JavaScript前端面试问题

    我知道有很多人不同意这种类型的面试.其实不管你喜不喜欢,你都得接受.尤其当你是自学的,而且要申请第一份工作时.   我估计很多有人其它方法来证明他自己,像Github/ 项目地址可能是非常理想的证明方 ...

  7. web前端面试试题总结---javascript篇

    JavaScript 介绍js的基本数据类型. Undefined.Null.Boolean.Number.String. ECMAScript 2015 新增:Symbol(创建后独一无二且不可变的 ...

  8. 2019前端面试系列——JS高频手写代码题

    实现 new 方法 /* * 1.创建一个空对象 * 2.链接到原型 * 3.绑定this值 * 4.返回新对象 */ // 第一种实现 function createNew() { let obj ...

  9. 前端面试之JavaScript的基本数据类型！

    前端面试之JavaScript的基本数据类型! JS的基本数据类型 数字 字符串 布尔值 JavaScript中有两个特殊的原始值: null (空) 和undefined (未定义), , 它们不是 ...

随机推荐

  1. extjs 4.2 高度自适应

    问题描述: gridPanel放在tabpanel页中,而且这个tabpanel页是通过add方法添加的,页面整体布局是:首先一个viewPort布局,left区域是一个treePanel,通过点击t ...

  2. apche配置后报错（Forbidden）没有权限

    apche如何配置虚拟目录及虚拟目录的权限 <Directory /> Options FollowSymLinks AllowOverride None Order deny,allow ...

  3. web前端开发和后端开发有什么区别？

    web前端分为网页设计师.网页美工.web前端开发工程师 首先网页设计师是对网页的架构.色彩以及网站的整体页面代码负责 网页美工只针对UI这块儿的东西,比如网站是否做的漂亮 web前端开发工程师是负责 ...

  4. mysql主键uuid、uuid_short和int自增对比

    数据库主键性能对比: 名称 存储长度 生成方式 1. uuid 32+4 uuid()函数 2. uuid20 20 UUID_SHORT()函数 3. bigint自增 20 auto_increm ...

  5. Spring Boot项目中使用jdbctemplate 操作MYSQL数据库

    不废话,先来代码 pom文件: <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http ...

  6. MyBatis操作指南-配置使用Provider动态生成SQL

  7. android 中获取当前焦点所在屏幕中的位置 view.getLocationOnScreen(location)

    final int[] location = new int[2]; view.getLocationOnScreen(location); final int[] location = new in ...

  8. Java提高篇——设计模式

    设计模式简介 设计模式(Design pattern)代表了最佳的实践,通常被有经验的面向对象的软件开发人员所采用.设计模式是软件开发人员在软件开发过程中面临的一般问题的解决方案.这些解决方案是众多软 ...

  9. 常用的WinAPI函数整理

    常用的WinAPI函数整理 一.进程  创建进程:    CreateProcess("C:\\windows\\notepad.exe",0,0,0,0,0,0,0,&s ...

  10. lua自定义迭代器

    迭代器 http://www.tutorialspoint.com/lua/lua_iterators.htm 迭代器能够让你遍历某个集合或者容器中的每一个元素. 对于lua来说, 集合通常指代 ta ...