最近在准备JavaScript的笔试题.网上看到有阿里的就拿来学习学习.自己写的答案在下边.
1、请编写一个JavaScript函数 parseQueryString,它的用途是把URL参数解析为一个对象,如:
var url = "http://www.taobao.com/index.php?key0=0&key1=1&key2=2....."
var obj = parseQueryString(url);
alert(obj.key0)? // 输出0
2、请编写一个通用的事件注册函数(请看下面的代码)。
function addEvent(element, type, handler)
{
// 在此输入你的代码,实现预定功能
}
3.尝试实现注释部分的Javascript代码,可在其他任何地方添加更多代码(如不能实现,说明一下不能实现的原因):
var Obj = function(msg){
this.msg = msg;
this.shout = function(){
alert(this.msg);
}
this.waitAndShout = function(){
//隔五秒钟后执行上面的shout方法
}
}
4.请根据下面的描述,用JSON语法编写一个对象: “小明今年22岁,来自杭州。兴趣是看电影和旅游。他有两个姐姐,一个叫小芬,今年25岁,职业是护士。还有一个叫小芳,今年23岁,是一名小学老师。”
var person = ?
5:请给JavaScript的String 原生对象添加一个名为trim 的原型方法,用于截取空白字符。要求:
alert(" taobao".trim()); // 输出 "taobao"
alert(" taobao ".trim()); // 输出 "taobao"
6:请编写一段JavaScript脚本生成下面这段DOM结构。要求:使用标准的DOM方法或属性。
淘!你喜欢
7,请说明下面各种情况的执行结果,并注明产生对应结果的理由。
function doSomething() {
alert(this);
}
① element.onclick = doSomething,点击element元素后。
② element.onclick = function() {doSomething()}, 点击element元素后。
③ 直接执行doSomething()。
8:请分别列出HTML、JavaScript、CSS、Java、php、python的注释代码形式。
9阅读以下JavaScript代码:
if (window.addEventListener) {
var addListener = function(el, type, listener, useCapture) {
el.addEventListener(type, listener, useCapture);
};
} else if (document.all) {
addListener = function(el, type, listener) {
el.attachEvent("on" + type, function() {
listener.apply(el);
});
};
}
请阐述 :
a) 代码的功能;
b) 代码的优点和缺点;
c) listener.apply(el) 在此处的作用;
d) 如果有可改进之处,请给出改进后的代码,并说明理由。
Answers:
1: 当然你也可以用var params=url.split("?")[1].split("&"); 我更喜欢这么写.
function parseQueryString(url) {
var params = url.substring(url.indexOf("?") + 1,url.length);
var paramsArray = params.split("&");
var result= {};
var entry ;
for(var i= 0 ; i < paramsArray.length;i++ ){
entry = paramsArray[i].split("=");
result[entry[0]] = entry[1];
}
return result;
}
返回值是 : {key0: "0", key1: "1", key2: "2"}
2: 这个其实不光有.AddEvent ,看了一下阮老师写的书, 总体提出来就这样;
说白了就是为了兼容怪异的IE,我是在IE 上用IE 8 测的,目前这些需求都满足.
var EventUtil = {
addEvent: function(element, type, handler){
if(element.addEventListener){
element.addEventListener(type,handler,false)
}else if(element.attachEvent()){
element.attachEvent("on" + type,handler)
}else{
element["on" + type] = handler;
}
},
removeEvent : function(element,type,handler){
if(element.removeEventListener){
element.removeEventListener(type,handler,false)
}else if(element.detachEvent()){
element.detachEvent("on" + type,handler)
}else{
element["on" + type] = null;
}
},
getEvent: function(event){
return event? event : window.event;
},
getTarget: function(event){
return event.target || event.srcElement;
},
stopPropagation:function(event){
if(event.stopPropagation){
event.stopPropagation();
}else{
event.cancelBubble = true;
}
},
preventDefault:function(event){
if(event.preventDefault){
event.preventDefault();
}else{
event.returnValue = false;
}
}
}
3:我直接就用ES6 写了,免得用es5 this 传过来传过去的.本身箭头函数中 没有本身的this, 箭头函数用的是箭头函数外边的那个this
var Obj = function(msg){
console.log(msg)
this.msg = msg;
this.shout = function(){
alert(this.msg);
}
this.waitAndShout = () => {
setTimeout(() => {
this.shout();
},5000)
}
}
var instance = new Obj("message");
instance.waitAndShout();
或者你也可以这么写 主要差在一个返回值.
var Obj = function(msg){
console.log(msg)
this.msg = msg;
this.shout = function(){
alert(this.msg);
}
this.waitAndShout = () => {
setTimeout(() => {
this.shout();
},5000)
}
return this;
}
Obj("message").waitAndShout();
4: 这个感觉简单一些
var person= {
name:"小明",
age:22,
city:"杭州",
interests:["看电影","旅游"],
sisters:[
{
name:"小芬",
age:25,
occupation:"护士"
},{
name:"小芳",
age:25,
occupation:"小学老师"
}
]
}
5:按照要求 给String的原生对象 也就是需要用原型链来解决.
话说回来真的在笔试里 写 正则? 可能我看见这道题就略过了...能背住?
这个例子是别人写的,我们就分析一下怎么满足条件的.
本身正则 //包围起来,后边没有其他修饰符
需要trim 字符串左右两边的空格, 空格在正则里边是 \s ,^表示以空格开始. * 表示任意个 ,可以理解为 ^\s左边多个空格开始.\s$ 右边多个空格结束,中间 包含了 a-z A-Z的字母,[]表示查找方括号之间的任何字符 . {n,m} 至少出现n次,最多出现m次,
然后调用了 String 本身的match 方法.
String.prototype.trim=function(){
var reg=/^\s*([a-zA-Z]{1,})\s*$/;
return this.match(reg)[1];
}
你们可以看下match方法 .返回值第一项是原来的字符,第二项是操作后的字符串
6.考验JavaScript 基础DOM 操作. 感觉没有机器 直接写还是有点难度.
var div = document.createElement("div");
var p = document.createElement("p");
var text = document.createTextNode("淘!你喜欢");
p.appendChild(text);
p.className = "slogan";
div.appendChild(p);
div.setAttribute("id","example");
document.body.appendChild(div);
或者可以这么写.
var div = document.createElement("div");
var p = document.createElement("p");
p.className = "slogan";
div.appendChild(p);
p.innerHTML = "淘! 你喜欢";
div.setAttribute("id","example");
document.body.appendChild(div);
我试了一下 就算把p.innerHTML 设置放到最后一行也好用. 但是看起来不方便 还是放前边吧.
7 答案:
①弹出element对象,通过函数赋值方式,this直接指向element对象
②弹出window对象,this是写在doSomething这个函数里面的,而函数的this和谁调用它有关。如果没有对象调用它,那么this是window.
③刷新页面弹出window,没有绑定对象的情况下this默认指向window
8 : 答案:
HTML注释
JavaScript注释单行//多行//
CSS注释//
Java注释单行//多行//
PHP注释单行//多行//
Python注释#
9: 答案:
a)给组件注册事件
b)优点:兼容了IE和W3C;缺点:第二个条件下应该声明var,否则就会变成全局函数,下面给出的写法就把addListener 变量提到了括号外边
c)作用:绑定listener的作用域为el
var addListener = function(el, type, listener, useCapture) {
if (window.addEventListener) {
el.addEventListener(type, listener, useCapture);
}else if (document.all) {
el.attachEvent("on" + type, function() {
listener.apply(el);
});
}else{
el["on"+type]=listener;
}
};