10道javascript笔试题
1、考察this
function fn() {
console.log(this.length);
}
var obj = {
length: 5,
method: function(fn) {
fn();
arguments[0]();
}
};
obj.method(fn, 1);
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
var length = 10;
function fn() {
console.log(this.length);
}
var obj = {
length: 5,
method: function(fn) {
fn();
arguments[0]();
}
};
obj.method(fn, 1);
|
输出：10 2
第一次输出10应该没有问题。我们知道取对象属于除了点操作符还可以用中括号，所以第二次执行时相当于arguments调用方法，this指向arguments，而这里传了两个参数，故输出arguments长度为2。
2、var和函数的提前声明
console.log(a);
var a = 2;
function a() {}
console.log(a);
}
fn(1);
|
1
2
3
4
5
6
7
8
|
function fn(a) {
console.log(a);
var a = 2;
function a() {}
console.log(a);
}
fn(1);
|
输出：function a() {} 2
我们知道var和function是会提前声明的，而且function是优先于var声明的（如果同时存在的话），所以提前声明后输出的a是个function，然后代码往下执行a进行重新赋值了，故第二次输出是2。
3、局部变量和全局变量
if (f === true) {
var a = 10;
}
function fn() {
var b = 20;
c = 30;
}
fn();
console.log(a);
console.log(b);
console.log(c);
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
var f = true;
if (f === true) {
var a = 10;
}
function fn() {
var b = 20;
c = 30;
}
fn();
console.log(a);
console.log(b);
console.log(c);
|
输出：10 报错 30
这是个我犯了很久的错误，很长一段时间我都以为{…}内的新声明的变量是局部变量，后来我才发现function内的新声明的变量才是局部变量，而 没有用var声明的变量在哪里都是全局变量。再次提醒切记只有function(){}内新声明的才能是局部变量，while{…}、if{…}、 for(..) 之内的都是全局变量（除非本身包含在function内）。
4、变量隐式声明
var a = 10;
}
alert(a);
|
1
2
3
4
5
|
if('a' in window) {
var a = 10;
}
alert(a);
|
答案：10
前面我说过function和var会提前声明，而其实{…}内的变量也会提前声明。于是代码还没执行前，a变量已经被声明，于是 ‘a’ in window 返回true，a被赋值。
5、给基本类型数据添加属性，不报错，但取值时是undefined
a.pro = 10;
console.log(a.pro + a);
var s = 'hello';
s.pro = 'world';
console.log(s.pro + s);
|
1
2
3
4
5
6
7
|
var a = 10;
a.pro = 10;
console.log(a.pro + a);
var s = 'hello';
s.pro = 'world';
console.log(s.pro + s);
|
答案：NaN undefinedhello
给基本类型数据加属性不报错，但是引用的话返回undefined，10+undefined返回NaN，而undefined和string相加时转变成了字符串。
6、函数声明优于变量声明
function fn() {};
var fn;
|
1
2
3
|
console.log(typeof fn);
function fn() {};
var fn;
|
答案：function
因为函数声明优于变量声明。我们知道在代码逐行执行前，函数声明和变量声明会提前进行，而函数声明又会优于变量声明，这里的优于可以理解为晚于变量声明后，如果函数名和变量名相同，函数声明就能覆盖变量声明。所以以上代码将函数声明和变量声明调换顺序还是一样结果。
7、判断一个字符串中出现次数最多的字符，并统计次数
- hash table方式：
var obj = {};
var maxn = -1;
var letter;
for(var i = 0; i < s.length; i++) {
if(obj[s[i]]) {
obj[s[i]]++;
if(obj[s[i]] > maxn) {
maxn = obj[s[i]];
letter = s[i];
}
} else {
obj[s[i]] = 1;
if(obj[s[i]] > maxn) {
maxn = obj[s[i]];
letter = s[i];
}
}
}
alert(letter + ': ' + maxn);
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
|
var s = 'aaabbbcccaaabbbaaa';
var obj = {};
var maxn = -1;
var letter;
for(var i = 0; i < s.length; i++) {
if(obj[s[i]]) {
obj[s[i]]++;
if(obj[s[i]] > maxn) {
maxn = obj[s[i]];
letter = s[i];
}
} else {
obj[s[i]] = 1;
if(obj[s[i]] > maxn) {
maxn = obj[s[i]];
letter = s[i];
}
}
}
alert(letter + ': ' + maxn);
|
- 正则方式：
var a = s.split('');
a.sort();
s = a.join('');
var pattern = /(\w)\1*/g;
var ans = s.match(pattern);
ans.sort(function(a, b) {
return a.length < b.length;
});;
console.log(ans[0][0] + ': ' + ans[0].length);
|
1
2
3
4
5
6
7
8
9
10
|
var s = 'aaabbbcccaaabbbaaabbbbbbbbbb';
var a = s.split('');
a.sort();
s = a.join('');
var pattern = /(\w)\1*/g;
var ans = s.match(pattern);
ans.sort(function(a, b) {
return a.length < b.length;
});;
console.log(ans[0][0] + ': ' + ans[0].length);
|
8、经典闭包
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<body>
<a href='#'> 第一个链接 </a> </br>
<a href='#'> 第二个链接 </a> </br>
<a href='#'> 第三个链接 </a> </br>
<a href='#'> 第四个链接 </a> </br>
</body>
|
1
2
3
4
5
6
7
8
|
<!-- 实现一段脚本，使得点击对应链接alert出相应的编号 -->
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<body>
<a href='#'> 第一个链接 </a> </br>
<a href='#'> 第二个链接 </a> </br>
<a href='#'> 第三个链接 </a> </br>
<a href='#'> 第四个链接 </a> </br>
</body>
|
- dom污染法：
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<body>
<a href='#'> 第一个链接 </a> </br>
<a href='#'> 第二个链接 </a> </br>
<a href='#'> 第三个链接 </a> </br>
<a href='#'> 第四个链接 </a> </br>
<script type="text/javascript">
var lis = document.links;
for(var i = 0, length = lis.length; i < length; i++) {
lis[i].index = i;
lis[i].onclick = function() {
alert(this.index);
};
}
</script>
</body>
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
|
<!-- 实现一段脚本，使得点击对应链接alert出相应的编号 -->
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<body>
<a href='#'> 第一个链接 </a> </br>
<a href='#'> 第二个链接 </a> </br>
<a href='#'> 第三个链接 </a> </br>
<a href='#'> 第四个链接 </a> </br>
<script type="text/javascript">
var lis = document.links;
for(var i = 0, length = lis.length; i < length; i++) {
lis[i].index = i;
lis[i].onclick = function() {
alert(this.index);
};
}
</script>
</body>
|
- 闭包：
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<body>
<a href='#'> 第一个链接 </a> </br>
<a href='#'> 第二个链接 </a> </br>
<a href='#'> 第三个链接 </a> </br>
<a href='#'> 第四个链接 </a> </br>
<script type="text/javascript">
var lis = document.links;
for(var i = 0, length = lis.length; i < length; i++) {
(function(i) {
lis[i].onclick = function() {
alert(i + 1);
};
})(i);
}
</script>
</body>
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
|
<!-- 实现一段脚本，使得点击对应链接alert出相应的编号 -->
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<body>
<a href='#'> 第一个链接 </a> </br>
<a href='#'> 第二个链接 </a> </br>
<a href='#'> 第三个链接 </a> </br>
<a href='#'> 第四个链接 </a> </br>
<script type="text/javascript">
var lis = document.links;
for(var i = 0, length = lis.length; i < length; i++) {
(function(i) {
lis[i].onclick = function() {
alert(i + 1);
};
})(i);
}
</script>
</body>
|
9、this
this.m_Text = 'division element';
this.m_Element = document.createElement('div');
this.m_Element.innerHTML = this.m_Text;
this.m_Element.addEventListener('click', this.func);
// this.m_Element.onclick = this.func;
}
JSClass.prototype.Render = function() {
document.body.appendChild(this.m_Element);
}
JSClass.prototype.func = function() {
alert(this.m_Text);
};
var jc = new JSClass();
jc.Render(); // add div
jc.func(); // 输出 division element
//click添加的div元素division element会输出underfined，为什么？
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
|
function JSClass() {
this.m_Text = 'division element';
this.m_Element = document.createElement('div');
this.m_Element.innerHTML = this.m_Text;
this.m_Element.addEventListener('click', this.func);
// this.m_Element.onclick = this.func;
}
JSClass.prototype.Render = function() {
document.body.appendChild(this.m_Element);
}
JSClass.prototype.func = function() {
alert(this.m_Text);
};
var jc = new JSClass();
jc.Render(); // add div
jc.func(); // 输出 division element
//click添加的div元素division element会输出underfined，为什么？
|
答案：division element undefined
第一次输出很好理解，第二次的话仔细看，this其实已经指向了this.m_Element，因为是this.m_Element调用的 addEventListener函数，所以内部的this全指向它了。可以试着加上一行代码this.m_Element.m_Text = ‘hello world’，就会alert出hello world了。
10、split
请编写一个JavaScript函数 parseQueryString，它的用途是把URL参数解析为一个对象，如： var url = “http://witmax.cn/index.php?key0=0&key1=1&key2=2″
var obj = {};
var a = url.split('?');
if(a === 1) return obj;
var b = a[1].split('&');
for(var i = 0, length = b.length; i < length; i++) {
var c = b[i].split('=');
obj[c[0]] = c[1];
}
return obj;
}
var url = 'http://witmax.cn/index.php?key0=0&key1=1&key2=2';
var obj = parseQueryString(url);
console.log(obj.key0, obj.key1, obj.key2); // 0 1 2
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
function parseQueryString(url) {
var obj = {};
var a = url.split('?');
if(a === 1) return obj;
var b = a[1].split('&');
for(var i = 0, length = b.length; i < length; i++) {
var c = b[i].split('=');
obj[c[0]] = c[1];
}
return obj;
}
var url = 'http://witmax.cn/index.php?key0=0&key1=1&key2=2';
var obj = parseQueryString(url);
console.log(obj.key0, obj.key1, obj.key2); // 0 1 2
|
如有意见建议欢迎交流斧正~
10道javascript笔试题的更多相关文章
- 这10道javascript笔试题你都会么
1.考察this var length = 10; function fn() { console.log(this.length); } var obj = { length: 5, metho ...
- 你应该知道的25道Javascript面试题
题目来自 25 Essential JavaScript Interview Questions.闲来无事,正好切一下. 一 What is a potential pitfall with usin ...
- java面试题—精选30道Java笔试题解答（二）
摘要: java面试题-精选30道Java笔试题解答(二) 19. 下面程序能正常运行吗() public class NULL { public static void haha(){ System ...
- 【笔试题】精选30道Java笔试题解答
转自于:精选30道Java笔试题解答 精选30道Java笔试题解答 1. 下面哪些是Thread类的方法() A. start() B. run() C. exit() D. getPriority( ...
- 精选30道Java笔试题附答案分析
精选30道Java笔试题解答 都是一些非常非常基础的题,是我最近参加各大IT公司笔试后靠记忆记下来的,经过整理献给与我一样参加各大IT校园招聘的同学们,纯考Java基础功底,老手们就不用进来了,免得笑 ...
- 174道 JavaScript 面试题，助你查漏补缺
最近在整理 JavaScript 的时候发现遇到了很多面试中常见的面试题,本部分主要是作者在 Github 等各大论坛收录的 JavaScript 相关知识和一些相关面试题时所做的笔记,分享这份总结给 ...
- Java程序员的10道XML面试题
包括web开发人员的Java面试在内的各种面试中,XML面试题在各种编程工作的面试中很常见.XML是一种成熟的技术,经常作为从一个平台到其他平台传输数据的标准.XML面试问题包括用于转换XML文件的X ...
- Java程序员的10道XML面试题 （转）
包括web开发人员的Java面试在内的各种面试中,XML面试题在各种编程工作的面试中很常见.XML是一种成熟的技术,经常作为从一个平台到其他平台传输数据的标准.XML面试问题包括用于转换XML文件的X ...
- 100 道 Linux 笔试题，能拿 80 分就算大神！
本套笔试题共100题,每题1分,共100分.(参考答案在文章末尾) 1. cron 后台常驻程序 (daemon) 用于: A. 负责文件在网络中的共享 B. 管理打印子系统C. 跟踪管理系统信息和错 ...
随机推荐
- 删除ORACLE的步骤
1.关闭oracle所有的服务.可以在windows的服务管理器中关闭: 2.打开注册表:regedit 打开路径: HKEY_LOCAL_MACHINE\SYSTEM\CurrentControlS ...
- float和double的精度
作者: jillzhang 联系方式:jillzhang@126.com 原网址:http://blog.csdn.net/wuna66320/article/details/1691734 1 范围 ...
- CASS 2008的野外操作码
表D-1 线面状地物符号代码表 坎类(曲): K(U) + 数(0-陡坎,1-加固陡坎,2-斜坡,3-加固斜坡,4-垄,5-陡崖,6-干沟) 线类(曲): X(Q) + 数(0-实线,1-内 ...
- [并查集] POJ 2236 Wireless Network
Wireless Network Time Limit: 10000MS Memory Limit: 65536K Total Submissions: 25022 Accepted: 103 ...
- psp个人软件开发
为开发人员提供一个PSP工具,简化时间记录工作:同时提供数据使用的工具,帮助开发人提高估算能力. 需求分析: 编号 特性 FEAT01 研发经理能够创建项目.指定或修改项目经理.删除尚未分配工作任务 ...
- java基础之 超类Object
一.概述: Object类是所有Java类的祖先.每个类都使用 Object 作为超类.所有对象(包括数组)都实现这个类的方法.在不明确给出超类的情况下,Java会自动把Object作为要 ...
- 写一个程序，用于分析一个字符串中各个单词出现的频率，并将单词和它出现的频率输出显示。（单词之间用空格隔开，如“Hello World My First Unit Test”）
public class Test { public void index() { String strWords = "Hello World My First Unit Test&quo ...
- PreparedStatement
PreparedStatement > 它是Statement接口的子接口: >强大之处: 防SQL攻击: 提高代码的可读性.可维护性: 提高效率! l 学习PreparedStateme ...
- js③
while(true){ console.log('hello'); }/每次执行完语句块之后,又会跳回去检查小括号里面的布尔值,如果为true,那么又会执行语句块一次. //while循环//var ...
- win7配上的网关会自动消失?解决
前几天遇见一台计算机,发现手动设置的ip和网关等...在使用了一会就变成,网关丢失,其他不变...奇怪啊...第一次遇见.后来找了一下.有答案了. 先将客户端卸载掉,再打开网络和共享中心-->本 ...