1.JavaScript是一门什么样的语言,它有哪些特点?(没有标准答案)
参考答案:
JavaScript是一门强大的编程语言,是一种专为与网页交互而设计的脚本语言,是一种动态类型、弱类型、基于原型的语言。
JavaScript是客户端和服务器端脚本语言,可以插入到HTML页面中,并且是目前较热门的Web开发语言。同时,JavaScript也是面向对象编程语言。
特点 :
1.脚本语言。JavaScript是一种解释型的脚本语言,C、C++等语言先编译后执行,而JavaScript是在程序的运行过程中逐行进行解释。
2.基于对象。JavaScript是一种基于对象的脚本语言,它不仅可以创建对象,也能使用现有的对象。
3.简单。JavaScript语言中采用的是弱类型的变量类型,对使用的数据类型未做出严格的要求,是基于Java基本语句和控制的脚本语言,其设计简单紧凑。
4.动态性。JavaScript是一种采用事件驱动的脚本语言,它不需要经过Web服务器就可以对用户的输入做出响应。在访问一个网页时,鼠标在网页中进行鼠标点击或上下移、窗口移动等操作JavaScript都可直接对这些事件给出相应的响应。
5.跨平台性。JavaScript脚本语言不依赖于操作系统,仅需要浏览器的支持。因此一个JavaScript脚本在编写后可以带到任意机器上使用,前提上机器上的浏览器支 持JavaScript脚本语言,目前JavaScript已被大多数的浏览器所支持。
2.JavaScript的数据类型都有什么?
- 基本数据类型:Number、String、Boolean、Null、Undefined
- 复杂数据类型:Object(Function、Array、Date、RegExp)
如何判断某变量是否为数组数据类型?
if (typeof Array.isArray === "undefined"){
Array.isArray = function(arg){
return Object.prototype.toString.call(arg)==="[object Array]";
}
}
3.已知ID的Input输入框,希望获取这个输入框的输入值,怎么做?(不使用第三方框架)
document.getElementById(ID).value;
4.希望获取到页面中所有的checkbox怎么做?(不使用第三方框架)
var inputs = document.getElementsByTagName("input"),
arr = [],
len = inputs.length;
while (len--){
if(inputs[len].type == "checkbox"){
arr.push(inputs[i]);
}
}
5.设置一个已知ID的DIV的html内容为xxxx,字体颜色设置为黑色(不使用第三方框架)
var oDiv = document.getElementById(ID);
oDiv.innerHTML = "xxxx";
oDiv.getElementById(ID).style.color = "black";
6.当一个DOM节点被点击时候,我们希望能够执行一个函数,应该怎么做?
先获取到这个DOM节点,然后绑定onclick事件。比如myDOM.onclick = fn
或者myDOM.addEventListener("click",fn);
或者直接在HTML中绑定<div onclick = "fn()"></div>
7.什么是Ajax和JSON,它们的优缺点。
Ajax是异步JavaScript和XML,用于在Web页面中实现异步数据交互。
优点:
- 可以使得页面不重载全部内容的情况下加载局部内容,降低数据传输量
- 避免用户不断刷新或者跳转页面,提高用户体验
缺点:
- 对搜索引擎不友好
- 要实现ajax下的前后退功能成本较大
- 可能造成请求数的增加
- 跨域问题限制
JSON是一种轻量级的数据交换格式,ECMA的一个子集
优点:轻量级、易于人的阅读和编写,便于机器(JavaScript)解析,支持复合数据类型(数组、对象、字符串、数字)
8.看下列代码输出为何?解释原因。
var a;
alert(typeof a); //undefined
alert(b); //报错
变量a是被声明的,只是没有赋值,所以值为undefined。而b未被声明,所以不存在。
9.看下列代码,输出什么?解释原因。
var a = null;
alert(typeof a); //object
10.看下列代码,输出什么?解释原因。
var undefined;
undefined == null; //true
1 == true; //true
2 == true; //false
0 == false; //true
0 == ''; // true
NaN == NaN; //false
[] == false; //true
[] == ![]; //true
- undefined与null在if语句中会被自动转为false,相等运算符直接报告两者相等。(如果是全等的话结果为false)
- 数字和布尔值进行比较会把布尔值变为数字,true为1,false为0。
- 0为假即false,空值或者空格也为false。
- NaN和任何值都不相等。
- []被当作数组处理,空数组转换为0,所以等于false。
- ![]想做将数组转换为布尔值的运算,[]为一个数组对象,所以![]为false。
看下面的代码,输出什么,foo的值为什么?
var foo = "11"+2-"1";
console.log(foo); //111
先做"11"+2运算,当一个为字符串一个为数字时,将数字转换为字符串,所以字符串拼接为"112"。当两个数据都是字符串时,+以外的运算会先把字符串转换为数字,即112-1=111,foo类型为Number。如果是+运算,则为"112"+“1”=“1121”,foo类型为String。
11.看代码给答案。
var a = new Object();
a.value = 1;
b = a;
b.value = 2;
alert(a.value); //2
a,b都指向同一个对象,所以b修改了value值,a的value值也变了。
12.已知数组var stringArray = [“This”, “is”, “Baidu”, “Campus”],Alert出"This is Baidu Campus"。
stringArray.join(" ");
已知有字符串foo=“get-element-by-id”,写一个function将其转化成驼峰表示法“getElementById”。
var fooArr = foo.split("-");
var newFoo = fooArr[0];
for(var i=1;i<fooArr.length;i++){
newFoo += fooArr[i].charAt(0).toUpperCase()+fooArr[i].slice(1);
}
return newFoo;
13.var numberArray = [3,6,2,4,1,5];
-
实现对该数组的倒排,输出[5,1,4,2,6,3]
numberArray.reverse();
-
实现对该数组的降序排列,输出[6,5,4,3,2,1]
numberArray.sort(function(a,b){
return b-a;
});
14.输出今天的日期,以YYYY-MM-DD的方式,比如今天是2014年9月26日,则输出2014-09-26
var date = new Date();
var year = date.getFullYear();
var month = date.getMonth()+1;
var nowDate = date.getDate();
if(month<10){month = "0" + month;}
if(nowDate<10){nowDate = "0" + nowDate;}
var today = year + "-" + month + "-" + nowDate;
15.将字符串“<tr><td>{KaTeX parse error: Expected 'EOF', got '}' at position 3: id}̲</td><…name}</td></tr>”中的{KaTeX parse error: Expected 'EOF', got '}' at position 3: id}̲替换成10,{name}替换成Tony。(使用正则表达式)
var str = "<tr><td>{$id}</td><td>{$name}</td></tr>";
str.replace(/\{\$id\}/,"10").replace(/\{\$name\}/,"Tony");
16.为了保证页面输出安全,我们经常需要对一些特殊的字符进行转义,请写一个函数escapeHtml,将<, >, &, \进行转义
function escapeHTML(str){
return str.replace(/[<>&"]/g,function(match){
switch(match){
case "<":
return "\<";
case ">":
return "\>";
case "&":
return "\&";
case "\"":
return "\"";
}
});
}
17.foo = foo||bar ,这行代码是什么意思?为什么要这样写?
如果foo不为假则使用原来的值,没有值则把bar的值付给foo。
18.看下列代码,将会输出什么?(变量声明提升)
var foo = 1;
function(){
console.log(foo); //undefined
var foo = 2;
console.log(foo); //2
}
函数声明和变量声明会被隐式地提升到当前作用域的顶部,但是不会提升赋值部分。相当于:
var foo = 1;
function(){
var foo;
console.log(foo); //undefined
foo = 2;
console.log(foo); //2
}
19.用js实现随机选取10–100之间的10个数字,存入一个数组,并排序。
var url = "http://item.taobao.com/item.htm?a=1&b=2&c=&d=xxx&e";
var gets = url.split("?")[1];
var getsArr = gets.split("&");
var obj = {};
for(var i=0;i<getsArr.length;i++){
obj[getsArr[i].split("=")[0]] = getsArr[i].split("=")[1];
}
return obj;
20.把两个数组合并,并删除第二个元素。
var arr1 = [1,2,3];
var arr2 = [“a”,“b”,“c”];
var newArr = arr1.contant(arr2);
newArr.splice(1,1);
21.怎样添加、移除、移动、复制、创建和查找节点
- appendChild() //添加
- reomveChild() //移除
- insertBefore() //移动
- cloneNode() //复制
- createElement();createTextNode();createDocumentFragment //复制
- getElementById();getElementsByTagName();getElementsByClassName();getElementsByName() //查找
22.有这样一个URL:http://item.taobao.com/item.htm?a=1&b=2&c=&d=xxx&e,请写一段JS程序提取URL中的各个GET参数(参数名和参数个数不确定),将其按key-value形式返回到一个json结构中,如{a:’1′, b:’2′, c:”, d:’xxx’, e:undefined}
var url = "http://item.taobao.com/item.htm?a=1&b=2&c=&d=xxx&e";
var gets = url.split("?")[1];
var getsArr = gets.split("&");
var obj = {};
for(var i=0;i<getsArr.length;i++){
obj[getsArr[i].split("=")[0]] = getsArr[i].split("=")[1];
}
return obj;
23.正则表达式构造函数var reg=new RegExp(“xxx”)与正则表达字面量var reg=//有什么不同?匹配邮箱的正则表达式?
当使用RegExp()构造函数的时候,不仅需要转义引号(即"表示"),并且还需要双反斜杠(即\表示一个\)。
/^([A-Za-z0-9-_])+@([A-Za-z0-9]+.)+([a-z])+$/
24.看下面代码,给出输出结果。
for(var i=1;i<=3;i++){
setTimeout(function(){
console.log(i); //4 //4 //4
},0);
};
Javascript事件处理器在线程空闲之前不会运行。
如何让上述代码输出1 2 3?
for(var i=1;i<=3;i++){
setTimeout((function(i){
console.log(i);
})(i),0); //立即执行函数
};
25.写一个function,清除字符串前后的空格。(兼容所有浏览器)
if(!String.prototype.trim){
String.prototype.trim = function(){
return this.replace(/^\s+/,"").replace(/\s+$/,"");
}
}
26.Javascript中callee和caller的作用?
如果一对兔子每月生一对兔子;一对新生兔,从第三个月起就开始生兔子;假定每对兔子都是一雌一雄,试问一对兔子,第n个月能繁殖成多少对兔子?(使用callee完成)
var result = [];
function fn(n){
if(n==1){
return 1;
}else if(n==2){
return 1;
}else{
result[n] = arguments.callee(n-2)+arguments.callee(n-1);
return result[n];
}
}
27. 解释什么是回调函数,并提供一个简单的例子
回调函数是可以作为参数传递给另一个函数的函数,并在某些操作完成后执行。下面是一个简单的回调函数示例,这个函数在某些操作完成后打印消息到控制台。
function modifyArray(arr, callback) {
// 对 arr 做一些操作
arr.push(100);
// 执行传进来的 callback 函数
callback();
}
var arr = [1, 2, 3, 4, 5];
modifyArray(arr, function() {
console.log("array has been modified", arr);
});
28. 如何检查一个数字是否为整数?
检查一个数字是小数还是整数,可以使用一种非常简单的方法,就是将它对 1 进行取模,看看是否有余数。
function isInt(num) {
return num % 1 === 0;
}
console.log(isInt(4)); // true
console.log(isInt(12.2)); // false
console.log(isInt(0.3)); // false
29. 你能解释一下 ES5 和 ES6 之间的区别吗?
ECMAScript 5(ES5):ECMAScript 的第 5 版,于 2009 年标准化。这个标准已在所有现代浏览器中完全实现。
ECMAScript 6(ES6)或 ECMAScript 2015(ES2015):第 6 版 ECMAScript,于 2015 年标准化。这个标准已在大多数现代浏览器中部分实现。
以下是 ES5 和 ES6 之间的一些主要区别:
// 箭头函数和字符串插值:
const greetings = (name) => {
return `hello ${name}`;
}
const greetings = name => `hello ${name}`;
30. Javascript 中的“闭包”是什么?举个例子?
闭包是在另一个函数(称为父函数)中定义的函数,并且可以访问在父函数作用域中声明和定义的变量。
闭包可以访问三个作用域中的变量:
- 在自己作用域中声明的变量;
- 在父函数中声明的变量;
- 在全局作用域中声明的变量。
var globalVar = "abc"; // 自调用函数 (function outerFunction (outerArg) { // outerFunction 作用域开始 // 在 outerFunction 函数作用域中声明的变量 var outerFuncVar = 'x'; // 闭包自调用函数 (function innerFunction (innerArg) { // innerFunction 作用域开始 // 在 innerFunction 函数作用域中声明的变量 var innerFuncVar = "y"; console.log( "outerArg = " + outerArg + " " + "outerFuncVar = " + outerFuncVar + " " + "innerArg = " + innerArg + " " + "innerFuncVar = " + innerFuncVar + " " + "globalVar = " + globalVar); // innerFunction 作用域结束 })(5); // 将 5 作为参数 // outerFunction 作用域结束 })(7); // 将 7 作为参数
innerFunction 是在 outerFunction 中定义的闭包,可以访问在 outerFunction 作用域内声明和定义的所有变量。除此之外,闭包还可以访问在全局命名空间中声明的变量。
上述代码的输出将是:
outerArg = 7 outerFuncVar = x innerArg = 5 innerFuncVar = y globalVar = abc
31. “this”关键字的原理是什么?请提供一些代码示例。
- 在 JavaScript 中,this 是指正在执行的函数的“所有者”,或者更确切地说,指将当前函数作为方法的对象。
function foo() { console.log( this.bar ); } var bar = "global"; var obj1 = { bar: "obj1", foo: foo }; var obj2 = { bar: "obj2" }; foo(); // "global" obj1.foo(); // "obj1" foo.call( obj2 ); // "obj2" new foo(); // undefined
32. 如何向 Array 对象添加自定义方法,让下面的代码可以运行?
JavaScript 不是基于类的,但它是基于原型的语言。这意味着每个对象都链接到另一个对象(也就是对象的原型),并继承原型对象的方法。你可以跟踪每个对象的原型链,直到到达没有原型的 null 对象。我们需要通过修改 Array 原型来向全局 Array 对象添加方法。
Array.prototype.average = function() {
// 计算 sum 的值
var sum = this.reduce(function(prev, cur) { return prev + cur; });
// 将 sum 除以元素个数并返回
return sum / this.length;
}
var arr = [1, 2, 3, 4, 5];
var avg = arr.average();
console.log(avg); // => 3
33. 请描述一下 Revealing Module Pattern 设计模式。
暴露模块模式(Revealing Module Pattern)是模块模式的一个变体,目的是维护封装性并暴露在对象中返回的某些变量和方法。如下所示:
var Exposer = (function() {
var privateVariable = 10;
var privateMethod = function() {
console.log('Inside a private method!');
privateVariable++;
}
var methodToExpose = function() {
console.log('This is a method I want to expose!');
}
var otherMethodIWantToExpose = function() {
privateMethod();
}
return {
first: methodToExpose,
second: otherMethodIWantToExpose
};
})();
Exposer.first(); // 输出: This is a method I want to expose!
Exposer.second(); // 输出: Inside a private method!
Exposer.methodToExpose; // undefined
它的一个明显的缺点是无法引用私有方法。
34. 列举Java和JavaScript之间的区别?
Java是一门十分完整、成熟的编程语言。相比之下,JavaScript是一个可以被引入HTML页面的编程语言。这两种语言并不完全相互依赖,而是针对不同的意图而设计的。 Java是一种面向对象编程(OOPS)或结构化编程语言,类似的如C ++或C,而JavaScript是客户端脚本语言,它被称为非结构化编程。
35. javascript的typeof返回哪些数据类型?
答案:string,boolean,number,undefined,function,object,symbol
36. 例举3种强制类型转换和2种隐式类型转换?
答案:强制(parseInt,parseFloat,number)
隐式(== ===)
37. split() 和 join() 的区别?
答案:前者是将字符串切割成数组的形式,后者是将数组转换成字符串
38. 数组方法pop() push() unshift() shift()的区别?
答案:push()尾部添加 pop()尾部删除
unshift()头部添加 shift()头部删除
39. IE和标准下有哪些兼容性的写法?
var ev = ev || window.event
document.documentElement.clientWidth || document.body.clientWidth
Var target = ev.srcElement||ev.target
40. ajax请求的时候get 和post方式的区别?
答案:
一个在url后面 ,一个放在虚拟载体里面
get有大小限制(只能提交少量参数)
安全问题
应用不同 ,请求数据和提交数据
41. call和apply的区别?
Object.call(this,obj1,obj2,obj3)
Object.apply(this,arguments)
42. ajax请求时,如何解析json数据?
答案:使用JSON.parse
44. 事件委托是什么?
答案: 利用事件冒泡的原理,让自己的所触发的事件,让他的父元素代替执行!
45. 闭包是什么,有什么特性,对页面有什么影响?
答案:闭包就是能够读取其他函数内部变量的函数,使得函数不被GC回收,如果过多使用闭包,容易导致内存泄露