(转)44 道 JavaScript 难题
JavaScript Puzzlers原文
1. ["1", "2", "3"].map(parseInt)
- 答案:[1, NaN, NaN]
- 解析:parseInt (val, radix) :两个参数,val值,radix基数(就是多少进制转换)
- map 能传进回调函数 3参数 (element, index, array)
- parseInt('1', 0); //0代表10进制
- parseInt('2', 1); //没有1进制,不合法
- parseInt('3', 2); //2进制根本不会有3
- 巩固:["1", "1", "11","5"].map(parseInt) //[1, NaN, 3, NaN]
2. [typeof null, null instanceof Object]
- 答案:["object", false]
- 解析:null代表空对象指针,所以typeof判断成一个对象。可以说JS设计上的一个BUG
- instanceof 实际上判断的是对象上构造函数,null是空当然不可能有构造函数
- 巩固:null == undefined //true null === undefined //flase
3. [ [3,2,1].reduce(Math.pow), [].reduce(Math.pow) ]
- 答案:an error
- 解析:Math.pow (x , y) x 的 y 次幂的值
- reduce(fn,total)
- fn (total, currentValue, currentIndex, arr)
- 如果一个函数不传初始值,数组第一个组默认为初始值.
- [3,2,1].reduce(Math.pow)
- Math.pow(3,2) //9
- Math.pow(9,1) //9
- [].reduce(Math.pow) //空数组会报TypeError
- 巩固:[1].reduce(Math.pow) //只有初始值就不会执行回调函数,直接返回1
- [].reduce(Math.pow,1) //只有初始值就不会执行回调函数,直接返回1
- [2].reduce(Math.pow,3) //传入初始值,执行回调函数,返回9
4.
- var val = 'smtg';
- console.log('Value is ' + (val === 'smtg') ? 'Something' : 'Nothing');
这段代码的执行结果?
- 答案:Something
- 解析:字符串连接比三元运算有更高的优先级
- 所以原题等价于 'Value is true' ? 'Somthing' : 'Nonthing'
- 而不是 'Value is' + (true ? 'Something' : 'Nonthing')
- 巩固:等我有空总结一下
5.
- var name = 'World!';
- (function () {
- if (typeof name === 'undefined') {
- var name = 'Jack';
- console.log('Goodbye ' + name);
- } else {
- console.log('Hello ' + name);
- }
- })();
这段代码的执行结果?
- 答案:Goodbye Jack
- 解析:(1)typeof时 name变量提升。 在函数内部之声明未定义
- (2)typeof优先级高于===
- 巩固:
- var str = 'World!';
- (function (name) {
- if (typeof name === 'undefined') {
- var name = 'Jack';
- console.log('Goodbye ' + name);
- } else {
- console.log('Hello ' + name);
- }
- })(str);
- 答案:Hello World 因为name已经变成函数内局部变量
6.
- var END = Math.pow(2, 53);
- var START = END - 100;
- var count = 0;
- for (var i = START; i <= END; i++) {
- count++;
- }
- console.log(count);
这段代码的执行结果?
- 答案:other ,不是101
- 解析:js中可以表示的最大整数不是2的53次方,而是1.7976931348623157e+308。2的53次方不是js能表示的最大整数而应该是能正确计算且不失精度的最大整数,
- 巩固:
- var END = 1234567635;
- var START = END - 1024;
- var c = count = 0;
- for (var i = START; i <= END; i++) {
- c = count++;
- }
- console.log(count); //1025
- console.log(c); //1024
7.
- var ary = [0,1,2];
- ary[10] = 10;
- ary.filter(function(x) { return x === undefined;});
这段代码的执行结果?
- 答案:[]
- 解析:filter() 不会对空数组进行检测。会跳过那些空元素
- 巩固:
- var ary = [0,1,2,undefined,undefined,undefined,null];
- ary.filter(function(x) { return x === undefined;});
- // [undefined, undefined, undefined]
8.
- var two = 0.2
- var one = 0.1
- var eight = 0.8
- var six = 0.6
- [two - one == one, eight - six == two]
这段代码的执行结果?
- 答案:[true, false]
- 解析:IEEE 754标准中的浮点数并不能精确地表达小数
- 巩固:var two = 0.2;
- var one = 0.1;
- var eight = 0.8;
- var six = 0.6;
- ( eight - six ).toFixed(4) == two
- //true
9.
- function showCase(value) {
- switch(value) {
- case 'A':
- console.log('Case A');
- break;
- case 'B':
- console.log('Case B');
- break;
- case undefined:
- console.log('undefined');
- break;
- default:
- console.log('Do not know!');
- }
- }
- showCase(new String('A'));
这段代码的执行结果?
- 答案:Do not know!
- 解析:new String(x)是个对象
- 巩固:下一题
10.
- function showCase2(value) {
- switch(value) {
- case 'A':
- console.log('Case A');
- break;
- case 'B':
- console.log('Case B');
- break;
- case undefined:
- console.log('undefined');
- break;
- default:
- console.log('Do not know!');
- }
- }
- showCase2(String('A'));
这段代码的执行结果?
- 答案:Case A
- 解析:String('A')就是返回一个字符串
11.
- function isOdd(num) {
- return num % 2 == 1;
- }
- function isEven(num) {
- return num % 2 == 0;
- }
- function isSane(num) {
- return isEven(num) || isOdd(num);
- }
- var values = [7, 4, '13', -9, Infinity];
- values.map(isSane);
这段代码的执行结果?
- 答案:[true, true, true, false, false]
- 解析:%如果不是数值会调用Number()去转化
- '13' % 2 // 1
- Infinity % 2 //NaN Infinity 是无穷大
- -9 % 2 // -1
- 巩固: 9 % -2 // 1 余数的正负号随第一个操作数
12.
- parseInt(3, 8)
- parseInt(3, 2)
- parseInt(3, 0)
这段代码的执行结果?
- 答案:3 NaN 3
- 解析:2进制不可能有3
13.
Array.isArray( Array.prototype )
这段代码的执行结果?
- 答案:true
- 解析:Array.prototype是一个数组
- 数组的原型是数组,对象的原型是对象,函数的原型是函数
14.
- var a = [0];
- if ([0]) {
- console.log(a == true);
- } else {
- console.log("wut");
- }
这段代码的执行结果?
- 答案:false
- 解析:[0]的boolean值是true
- 巩固:a[0] 的boolean是 false
15.[]==[]
- 答案:false
- 解析:两个引用类型, ==比较的是引用地址
- 巩固:[]== ![]
- (1)! 的优先级高于== ,右边运算结果等于 false
- (2)一个引用类型和一个值去比较 把引用类型转化成值类型,左边0
- (3)所以 0 == false 答案是true
16.
- '5' + 3
- '5' - 3
这段代码的执行结果?
- 答案:53 2
- 解析:加号有拼接功能,减号就是逻辑运算
17. 1 + - + + + - + 1
- 答案:2
- 解析:+-又代表正负号, 负负得正。
18.
- var ary = Array(3);
- ary[0]=2
- ary.map(function(elem) { return '1'; });
这段代码的执行结果?
- 答案:["1", empty × 2]
- 解析:如过没有值,map会跳过不会执行回调函数
19.
- function sidEffecting(ary) {
- ary[0] = ary[2];
- }
- function bar(a,b,c) {
- c = 10
- sidEffecting(arguments);
- return a + b + c;
- }
- bar(1,1,1)
这段代码的执行结果?
- 答案:21,
- 解析:arguments会和函数参数绑定。
- 但如果es6付给初始值则无法修改
- function sidEffecting(ary) {
- ary[0] = ary[2];
- }
- function bar(a=1,b,c) {
- c = 10
- sidEffecting(arguments);
- return a + b + c;
- }
- bar(1,1,1)
- //12
20.
- var a = 111111111111111110000,
- b = 1111;
- a + b;
这段代码的执行结果?
- 答案:11111111111111111000
- 解析:在JavaScript中number类型在JavaScript中以64位(8byte)来存储。这64位中有符号位1位、指数位11位、实数位52位。2的53次方时,是最大值。其值为:9007199254740992(0x20000000000000)。超过这个值的话,运算的结果就会不对.
21.
- var x = [].reverse;
- x();
这段代码的执行结果?
- 答案:window
- 解析:但在chrome上执行报错,没太懂
22.Number.MIN_VALUE > 0
- 答案:true
- 解析:MIN_VALUE 属性是 JavaScript 中可表示的最小的数(接近 0 ,但不是负数)。它的近似值为 5 x 10-324。
23.[1 < 2 < 3, 3 < 2 < 1]
- 答案:[true,true]
- 解析: 1 < 2 => true;
- true < 3 => 1 < 3 => true;
- 3 < 2 => false;
- false < 1 => 0 < 1 => true;
24.2 == [[[2]]]
- 答案:true
- 解析:值和引用类型去比较,把引用类型转话成值类型
- [[[2]]])//2
25.
- 3.toString()
- 3..toString()
- 3...toString()
这段代码的执行结果?
- 答案:error, "3", error
- 解析:因为在 js 中 1.1, 1., .1 都是合法的数字. 那么在解析 3.toString 的时候这个 . 到底是属于这个数字还是函数调用呢? 只能是数字, 因为3.合法啊!
26.
- (function(){
- var x = y = 1;
- })();
- console.log(y);
- console.log(x);
这段代码的执行结果?
- 答案:1, error
- 解析:y 被赋值成全局变量,等价于
- y = 1 ;
- var x = y;
27.
- var a = /123/,
- b = /123/;
- a == b
- a === b
这段代码的执行结果?
- 答案:false, false
- 解析:正则是对象,引用类型,相等(==)和全等(===)都是比较引用地址
28.
- var a = [1, 2, 3],
- b = [1, 2, 3],
- c = [1, 2, 4]
- a == b
- a === b
- a > c
- a < c
这段代码的执行结果?
- 答案:false, false, false, true
- 解析:相等(==)和全等(===)还是比较引用地址
- 引用类型间比较大小是按照字典序比较,就是先比第一项谁大,相同再去比第二项。
29.
- var a = {}, b = Object.prototype;
- [a.prototype === b, Object.getPrototypeOf(a) === b]
这段代码的执行结果?
- 答案:false, true
- 解析:Object 的实例是 a,a上并没有prototype属性
- a的__poroto__ 指向的是Object.prototype,也就是Object.getPrototypeOf(a)。a的原型对象是b
30.
- function f() {}
- var a = f.prototype, b = Object.getPrototypeOf(f);
- a === b
这段代码的执行结果?
- 答案:false
- 解析:a是构造函数f的原型 : {constructor: ƒ}
- b是实例f的原型对象 : ƒ () { [native code] }
31.
- function foo() { }
- var oldName = foo.name;
- foo.name = "bar";
- [oldName, foo.name]
这段代码的执行结果?
- 答案:["foo", "foo"]
- 解析:函数的名字不可变.
32."1 2 3".replace(/\d/g, parseInt)
- 答案:"1 NaN 3"
- 解析:replace() 回调函数的四个参数:
- 1、匹配项
- 2、与模式中的子表达式匹配的字符串
- 3、出现的位置
- 4、stringObject 本身 。
- 如果没有与子表达式匹配的项,第二参数为出现的位置.所以第一个参数是匹配项,第二个参数是位置
- parseInt('1', 0)
- parseInt('2', 2) //2进制中不可能有2
- parseInt('3', 4)
- 巩固:
- "And the %1".replace(/%([1-8])/g,function(match,a , b ,d){
- console.log(match +" "+ a + " "+ b +" "+d )
- });
- //%1 1 8 And the %1
33.
- function f() {}
- var parent = Object.getPrototypeOf(f);
- f.name // ?
- parent.name // ?
- typeof eval(f.name) // ?
- typeof eval(parent.name) // ?
这段代码的执行结果?
- 答案:"f", "Empty", "function", error
- 解析:f的函数名就是f
- parent是f原型对象的名字为"" ,
- 先计算eval(f.name) 为 f,f的数据类型是function
- eval(parent.name) 为undefined, "undefined"
34.
- var lowerCaseOnly = /^[a-z]+$/;
- lowerCaseOnly.test(null), lowerCaseOnly.test()]
这段代码的执行结果?
- 答案:[true, true]
- 解析:这里 test 函数会将参数转为字符串. 'nul', 'undefined' 自然都是全小写了
35.[,,,].join(",")
- 答案:",,"
- 解析:因为javascript 在定义数组的时候允许最后一个元素后跟一个,
- 所以这个数组长度是3,
- 巩固: [,,1,].join(".").length // 3
36.
- var a = {class: "Animal", name: 'Fido'};
- a.class
这段代码的执行结果?
- 答案:other
- 解析:这取决于浏览器。类是一个保留字,但是它被Chrome、Firefox和Opera接受为属性名。在另一方面,每个人都会接受大多数其他保留词(int,私有,抛出等)作为变量名,而类是VordBoint。
37.var a = new Date("epoch")
- 答案:other
- 解析:您得到“无效日期”,这是一个实际的日期对象(一个日期的日期为true)。但无效。这是因为时间内部保持为一个数字,在这种情况下,它是NA。
- 在chrome上是undefined
- 正确的是格式是var d = new Date(year, month, day, hours, minutes, seconds, milliseconds);
38.
- var a = Function.length,
- b = new Function().length
- a === b
这段代码的执行结果?
- 答案:false
- 解析:首先new在函数带()时运算优先级和.一样所以从左向右执行
- new Function() 的函数长度为0
- 巩固:function fn () {
- var a = 1;
- }
- console.log(fn.length)
- //0 fn和new Function()一样
39.
- var a = Date(0);
- var b = new Date(0);
- var c = new Date();
- [a === b, b === c, a === c]
这段代码的执行结果?
- 答案:[false, false, false]
- 解析:当日期被作为构造函数调用时,它返回一个相对于划时代的对象(JAN 01 1970)。当参数丢失时,它返回当前日期。当它作为函数调用时,它返回当前时间的字符串表示形式。
- a是字符串 a === b // 数据类型都不同,肯定是false
- b是对象 b === c // 引用类型,比的是引用地址
- c也是对象 a === c // 数据类型都不同,肯定是false
- 巩固: var a = Date(2018);
- var b = Date(2001);
- [a ===b ]
- //[true] Date() 方法获得当日的日期,作为函数调用不需要,返回的同一个字符串
- "Tue Jun 12 2018 14:36:24 GMT+0800 (CST)" 当然如果a,b执行时间相差1秒则为false
40.
- var min = Math.min(), max = Math.max()
- min < max
这段代码的执行结果?
- 答案:false
- 解析: Math.min 不传参数返回 Infinity, Math.max 不传参数返回 -Infinity
- 无限集合之间不能比较大小。
- 巩固:Number.MAX_VALUE > Number.MIN_VALUE //true
41.
- function captureOne(re, str) {
- var match = re.exec(str);
- return match && match[1];
- }
- var numRe = /num=(\d+)/ig,
- wordRe = /word=(\w+)/i,
- a1 = captureOne(numRe, "num=1"),
- a2 = captureOne(wordRe, "word=1"),
- a3 = captureOne(numRe, "NUM=2"),
- a4 = captureOne(wordRe, "WORD=2");
- [a1 === a2, a3 === a4]
这段代码的执行结果?
- 答案:[true, false]
- 解析: /g有一个属性叫lastIndex,每次匹配如果没有匹配到,它将重置为0,如果匹配到了,他将记录匹配的位置。我们看一个简单的例子吧。
- var numRe = /num=(\d)/g;
- numRe.test("num=1abcwewe") //true
- numRe.lastIndex //5 匹配到num=1后在5的索引位置
- numRe.exec("num=1") //fales 这次要从5的索引位置,开始匹配
- numRe.lastIndex //0 上一次匹配失败了numRe.lastIndex重制为0
42.
- var a = new Date("2014-03-19"),
- b = new Date(2014, 03, 19);
- [a.getDay() === b.getDay(), a.getMonth() === b.getMonth()]
这段代码的执行结果?
- 答案:[false, false]
- 解析: var a = new Date("2014-03-19") //能够识别这样的字符串,返回想要的日期
- Wed Mar 19 2014 08:00:00 GMT+0800 (CST)
- b = new Date(2014, 03, 19); //参数要按照索引来
- Sat Apr 19 2014 00:00:00 GMT+0800 (CST)
- 月是从0索引,日期是从1
- getDay()是获取星期几
- getMonth()是获取月份所以都不同
- 巩固: [a.getDate() === b.getDate()] //true
43.
- if ('http://giftwrapped.com/picture.jpg'.match('.gif')) {
- 'a gif file'
- } else {
- 'not a gif file'
- }
这段代码的执行结果?
- 答案:'a gif file'
- 解析: String.prototype.match 接受一个正则, 如果不是, 按照 new RegExp(obj) 转化. 所以 . 并不会转义 。 那么 /gif 就匹配了 /.gif/
- 巩固: if ('http://giftwrapped.com/picture.jpg'.indexOf('.gif')) {
- 'a gif file'
- } else {
- 'not a gif file'
- }
- //'a gif file' 同样的道理
(转)44 道 JavaScript 难题的更多相关文章
- 44 道 JavaScript 难题(JavaScript Puzzlers!)
JavaScript Puzzlers原文 1. ["1", "2", "3"].map(parseInt) 答案:[1, NaN, NaN ...
- 44 道 JavaScript 难题
JavaScript Puzzlers原文 1. ["1", "2", "3"].map(parseInt) 答案:[1, NaN, N ...
- 44道JS难题
国外某网站给出了44道JS难题,试着做了下,只做对了17道.这些题涉及面非常广,涵盖JS原型.函数细节.强制转换.闭包等知识,而且都是非常细节的东西,透过这些小细节可以折射出很多高级的JS知识点. 你 ...
- 44道JavaScript送命题
很久以前看过一个老外写的帖子,JavaScript Puzzlers!,直译就是JavaScript难题,里面列举了100道JavaScript选择题,大部分都是让人摸不着头脑的题目,需要仔细琢磨一番 ...
- 你应该知道的25道Javascript面试题
题目来自 25 Essential JavaScript Interview Questions.闲来无事,正好切一下. 一 What is a potential pitfall with usin ...
- 44个 Javascript 变态题解析 (下)
承接上篇 44个 Javascript 变态题解析 (上) 第23题 [1 < 2 < 3, 3 < 2 < 1] 这个题也还可以. 这个题会让人误以为是 2 > 1 & ...
- TOM大叔的几道Javascript题目与解答
几道JS题目 之前没有深入研究js语言,最近几年前端越来越工程化,需要扎实的js基础,看到博客园上有很多大牛分享JS学习文章,幸运看到tom大叔的blog,抽时间潜心学习了其文章,遇到到其出的几道题目 ...
- 174道 JavaScript 面试题,助你查漏补缺
最近在整理 JavaScript 的时候发现遇到了很多面试中常见的面试题,本部分主要是作者在 Github 等各大论坛收录的 JavaScript 相关知识和一些相关面试题时所做的笔记,分享这份总结给 ...
- 汤姆大叔的6道javascript编程题题解
看汤姆大叔的博文,其中有篇(猛戳这里)的最后有6道编程题,于是我也试试,大家都可以先试试. 1.找出数字数组中最大的元素(使用Math.max函数) var a = [1, 2, 3, 6, 5, 4 ...
随机推荐
- iframe 与frameset
frameset 元素可定义一个框架集.它被用来组织多个窗口(框架).每个框架存有独立的文档.在其最简单的应用中,frameset 元素仅仅会规定在框架集中存在多少列或多少行.您必须使用 cols 或 ...
- Leetcode 123.买卖股票的最佳时机III
买卖股票的最佳时机III 给定一个数组,它的第 i 个元素是一支给定的股票在第 i 天的价格. 设计一个算法来计算你所能获取的最大利润.你最多可以完成 两笔 交易. 注意: 你不能同时参与多笔交易(你 ...
- 洛谷 P2683 小岛
P2683 小岛 题目背景 西伯利亚北部的寒地,坐落着由 N 个小岛组成的岛屿群,我们把这些小岛依次编号为 1 到 N . 题目描述 起初,岛屿之间没有任何的航线.后来随着交通的发展,逐渐出现了一些连 ...
- Ubuntu 16.04安装indicator-sysmonitor实现导航条显示上下行网速/CPU/内存使用率
安装: sudo add-apt-repository ppa:fossfreedom/indicator-sysmonitor sudo apt-get update sudo apt-get in ...
- Install nginx-clojure on CentOS 7
Install nginx-clojure on CentOS 7 1. install open-jdk-7 sudo yum install java-1.7.0-openjdk-devel 2. ...
- Chrome 消息机制
Chrome浏览器扩展开发系列之十四:本地消息机制Native messaging 时间:2015-10-08 16:17:59 阅读:1560 评论:0 收藏:0 ...
- LeetCode 168. Excel Sheet Column Title (Excel 表格列名称)
Given a positive integer, return its corresponding column title as appear in an Excel sheet. For exa ...
- linux下误删数据文件恢复
linux下文件被删除能够用非常多工具进行恢复.比如undelete(适合ext2,ext3).giis(不能恢复安装giis之前的文件).ext3grep(仅限ext3).R-linux(支持ext ...
- LNMP环境搭建——PHP篇
一.源代码安装 1.编译安装 ./configure --prefix=/usr/local/php\ --with-config-file-path=/usr/local/php/etc --wit ...
- xshell暂停串口的打印【转】
本文转载自:http://www.360doc.com/content/16/0311/10/7821691_541261680.shtml xshell不想CRT可以断开而停止打印,看这停下的打印信 ...