js部分面试题

1.将数字12345678转化成RMB形式，如：12，345，678

//个人方法；
//思路：先将数字转为字符， str= str + '' ;
//利用反转函数，每三位字符加一个 ','最后一位不加； re()是自定义的反转函数，最后再反转回去！
for(var i = 1; i <= re(str).length; i++){
    tmp += re(str)[i - 1];
    if(i % 3 == 0 && i != re(str).length){
        tmp += ',';
    }
}

2.生成5个不同的随机数。

//思路：5个不同的数，每生成一次就和前面的所有数字相比较，如果有相同的，则放弃当前生成的数字！
var num1 = [];
for(var i = 0; i < 5; i++){
    num1[i] = Math.floor(Math.random()*10) + 1; //范围是 [1, 10]
    for(var j = 0; j < i; j++){
        if(num1[i] == num1[j]){
            i--;
        }
    }
}

3.去掉数组中重复的数字。

方法一：

在这里插入代码片//思路：每遍历一次就和之前的所有做比较，不相等则放入新的数组中！
//这里用的原型 个人做法；
Array.prototype.unique = function(){
    var len = this.length,
        newArr = [],
        flag = 1;
    for(var i = 0; i < len; i++, flag = 1){
        for(var j = 0; j < i; j++){
             if(this[i] == this[j]){
                flag = 0;        //找到相同的数字后，不执行添加数据
            }
        }
        flag ? newArr.push(this[i]) : '';
    }
    return newArr;
}

方法二：

(function(arr){
    var len = arr.length,
        newArr = [], 
        flag;
    for(var i = 0; i < len; i+=1, flag = 1){
        for(var j = 0; j < i; j++){
            if(arr[i] == arr[j]){
                flag = 0;
            }  
        }
        flag?newArr.push(arr[i]):'';
    }
    alert(newArr);
})([1, 1, 22, 3, 4, 55, 66]);

4.window.location.search() 返回的是什么？

查询(参数)部分。除了给动态语言赋值以外，我们同样可以给静态页面,并使用javascript来获得相信应的参数值
返回值：?ver=1.0&id=timlq 也就是问号后面的！

5.window.location.reload() 作用？

刷新当前页面。

6.阻止冒泡函数。

function stopPropagation(e) {  
    e = e || window.event;  
    if(e.stopPropagation) { //W3C阻止冒泡方法  
        e.stopPropagation();  
    } else {  
        e.cancelBubble = true; //IE阻止冒泡方法  
    }  
}  
document.getElementById('need_hide').onclick = function(e) {  
    stopPropagation(e);  
}

7.什么是闭包？写一个简单的闭包？

答：我的理解是，闭包就是能够读取其他函数内部变量的函数。在本质上，闭包就是将函数内部和函数外部连接起来的一座桥梁。

function outer(){
    var num = 1;
    function inner(){
        var n = 2;
        alert(n + num);
    }
    return inner;
}
outer()();

8.看图做答：

function f1(){
    var tmp = 1;
    this.x = 3;
    console.log(tmp);    //A
    console.log(this.x)；     //B
}
var obj = new f1(); //1
console.log(obj.x)     //2
console.log(f1());        //3

分析：
这道题让我重新认识了对象和函数，首先看代码（1），这里实例话化了 f1这个类。相当于执行了 f1函数。所以这个时候 A 会输出 1， 而 B 这个时候的 this 代表的是 实例化的当前对象 obj B 输出 3.。 代码（2）毋庸置疑会输出 3， 重点 代码（3）首先这里将不再是一个类，它只是一个函数。那么 A输出 1， B呢？这里的this 代表的其实就是window对象，那么this.x 就是一个全局变量 相当于在外部 的一个全局变量。所以 B 输出 3。最后代码由于f没有返回值那么一个函数如果没返回值的话，将会返回 underfined ，所以答案就是 ： 1， 3， 3， 1， 3， underfined 。

9.下面输出多少？

var o1 = new Object();
var o2 = o1;
o2.name = "CSSer";
console.log(o1.name);  //CSSer

如果不看答案，你回答正确了的话，那么说明你对javascript的数据类型了解的还是比较清楚了。js中有两种数据类型，分别是：基本数据类型和引用数据类型（object Array）。对于保存基本类型值的变量，变量是按值访问的，因为我们操作的是变量实际保存的值。对于保存引用类型值的变量，变量是按引用访问的，我们操作的是变量值所引用（指向）的对象。答案就清楚了： //CSSer;

10.下面输出多少？

function changeObjectProperty (o) {
    o.siteUrl = "http://www.csser.com/";
    o = new Object();
    o.siteUrl = "http://www.popcg.com/";
}
var CSSer = new Object();
changeObjectProperty(CSSer);
console.log(CSSer.siteUrl);   //http://www.csser.com/

如果CSSer参数是按引用传递的，那么结果应该是"http://www.popcg.com/"，但实际结果却仍是"http://www.csser.com/"。事实是这样的：在函数内部修改了引用类型值的参数，该参数值的原始引用保持不变。我们可以把参数想象成局部变量，当参数被重写时，这个变量引用的就是一个局部变量，局部变量的生存期仅限于函数执行的过程中，函数执行完毕，局部变量即被销毁以释放内存。
（补充：内部环境可以通过作用域链访问所有的外部环境中的变量对象，但外部环境无法访问内部环境。每个环境都可以向上搜索作用域链，以查询变量和函数名，反之向下则不能。）

11.输出多少？

var a = 6;
setTimeout(function () {    
    var a = 666;
    alert(a);      // 输出666
}, 1000);
a = 66;

因为var a = 666;定义了局部变量a，并且赋值为666，根据变量作用域链，
全局变量处在作用域末端，优先访问了局部变量，从而覆盖了全局变量 。

var a = 6;
setTimeout(function () {    
    alert(a);      // 输出undefined 
    var a = 666;
}, 1000);
a = 66;

因为var a = 666;定义了局部变量a，同样覆盖了全局变量，但是在alert(a);之前a并未赋值，所以输出undefined。

var a = 6; 
setTimeout(function(){
    alert(a);
    var a = 66; 
}, 1000);
a = 666; 
alert(a); 
// 666, undefined;

记住： 异步处理，一切OK 声明提前

12.输出多少？

function setN(obj){
    obj.name='屌丝';
    obj = new Object(); 
    obj.name = '腐女';
};
var per = new Object();
setN(per);
alert(per.name);  //屌丝

13.什么是同源策略？

指： 同协议、端口、域名的安全策略，由王景公司提出来的安全协议！

14.call和applay的区别是什么？

参数形式不同，call(obj, pra, pra)后面是单个参数。applay(obj, [args])后面是数组。

15.输出结果

var a = 5; 
function test(){
    a = 0; 
    alert(a); 
    alert(this.a); //没有定义 a这个属性
    var a; 
    alert(a)
}
test(); // 0, 5, 0
new test(); // 0, undefined, 0 //由于类它自身没有属性a， 所以是undefined

16.结果是：

var bool = !!2; 
alert(bool)；//true;

双向非操作可以把字符串和数字转换为布尔值。

17.声明对象，添加属性，输出属性

    var obj = {
        name: 'leipeng',
        showName: function(){
            alert(this.name);
        }
    }
obj.showName();

18.匹配输入的字符：第一个必须是字母或下划线开头，长度5-20

var reg = /^[a-zA-Z][a-zA-Z0-9_]{5,20}/,
            name1 = 'leipeng',
            name2 = '0leipeng',
            name3 = '你好leipeng',
            name4 = 'hi';
     
        alert(reg.test(name1));  //true
        alert(reg.test(name2));  //false
        alert(reg.test(name3));  //false
        alert(reg.test(name4));  //false

19.如何在HTML中添加事件，几种方法？

1、标签之中直接添加 οnclick=“fun()”;
2、JS添加 Eobj.onclick = method;
3、现代事件 IE： obj.attachEvent(‘onclick’, method)；
FF: obj.addEventListener(‘click’, method, false);

20.BOM对象有哪些，列举window对象？

1、window对象 ，是JS的最顶层对象，其他的BOM对象都是window对象的属性；
2、document对象，文档对象；
3、location对象，浏览器当前URL信息；
4、navigator对象，浏览器本身信息；
5、screen对象，客户端屏幕信息；
6、history对象，浏览器访问历史信息；

21.请用代码实现outerHTML

//说明：outerHTML其实就是innerHTML再加上本身；
Object.prototype.outerHTML = function(){
        var innerCon = this.innerHTML, //获得里面的内容
            outerCon = this.appendChild(innerCon); //添加到里面
        alert(outerCon); 
    }

演示代码：

<!doctype html>
 <html>
  <head>
    <meta charset="UTF-8">
    <title>Document</title>
  </head>
  <body>
    <div id="outer">
       hello
    </div>
  <script>
    Object.prototype.outerHTML = function(){
    var innerCon = this.innerHTML, //获得里面的内容
    outerCon = this.appendChild(innerCon); //添加到里面
    alert(outerCon); 
      }
    function $(id){
   return document.getElementById(id);
   }
   alert($('outer').innerHTML);
   alert($('outer').outerHTML);
  </script>
 </body>
 </html>

22.bind(), live(), delegate()的区别

bind： 绑定事件，对新添加的事件不起作用，方法用于将一个处理程序附加到每个匹配元素的事件上并返回jQuery对象。
live： 方法将一个事件处理程序附加到与当前选择器匹配的所有元素（包含现有的或将来添加的）的指定事件上并返回jQuery对象。
delegate： 方法基于一组特定的根元素将处理程序附加到匹配选择器的所有元素（现有的或将来的）的一个或多个事件上。

23.typeof 的返回类型有哪些？

alert(typeof [1, 2]); //object
alert(typeof 'leipeng'); //string
var i = true; 
alert(typeof i); //boolean
alert(typeof 1); //number
var a; 
alert(typeof a); //undefined
function a(){;};
alert(typeof a) //function

24.简述link和import的区别？

区别1：link是XHTML标签，除了加载CSS外，还可以定义RSS等其他事务；@import属于CSS范畴，只能加载CSS。
区别2：link引用CSS时，在页面载入时同时加载；@import需要页面网页完全载入以后加载。
区别3：link是XHTML标签，无兼容问题；@import是在CSS2.1提出的，低版本的浏览器不支持。
区别4：link支持使用Javascript控制DOM去改变样式；而@import不支持。

25.window.onload 和 document.ready的区别？

load要等到图片和包含的文件都加在进来之后执行；
ready是不包含图片和非文字文件的文档结构准备好就执行；

26.看下列代码输出什么？

var foo = "11"+2-"1";
console.log(foo);
console.log(typeof foo);

执行完后foo的值为111，foo的类型为Number。

27.看下列代码，输出什么？

var a = new Object();
a.value = 1;
b = a;
b.value = 2;
alert(a.value);

执行完后输出结果为2

28.已知数组var stringArray = ["This”, "is”, "Baidu”, "Campus”]，Alert出”This is Baidu Campus”。

答案：alert(stringArray.join(""))

29.已知有字符串foo=“get-element-by-id”,写一个function将其转化成驼峰表示法"getElementById"。

function combo(msg){
  var arr = msg.split("-");
  var len = arr.length;  //将arr.length存储在一个局部变量可以提高for循环效率
  for(var i=1;i<len;i++){
    arr[i]=arr[i].charAt(0).toUpperCase()+arr[i].substr(1,arr[i].length-1);
  }
  msg=arr.join("");
  return msg;
}

30.怎样添加、移除、移动、复制、创建和查找节点

1）创建新节点
createDocumentFragment() //创建一个DOM片段
createElement() //创建一个具体的元素
createTextNode() //创建一个文本节点
2）添加、移除、替换、插入
appendChild() //添加
removeChild() //移除
replaceChild() //替换
insertBefore() //插入
3）查找
getElementsByTagName() //通过标签名称
getElementsByName() //通过元素的Name属性的值
getElementById() //通过元素Id，唯一性

31.原生JS的window.onload与Jquery的$(document).ready(function(){})有什么不同？

window.onload()方法是必须等到页面内包括图片的所有元素加载完毕后才能执行。
$(document).ready()是DOM结构绘制完毕后就执行，不必等到加载完毕。

32.你如何优化自己的代码？

代码重用
避免全局变量（命名空间，封闭空间，模块化mvc…）
拆分函数避免函数过于臃肿
注释

33.specify(‘hello,world’)//=>’h,e,l,l,o,w,o,r,l,d’实现specify函数

function specify(str) {
      var tempArray = Array.prototype.filter.call(str, function (value, index, array) {
        return value >= 'A' && value <= 'z' && value != "_";
      });
      return tempArray.join(",");
    }
    console.log(specify("hello,world")); //h,e,l,l,o,w,o,r,l,d

34.请将一个URL的search部分参数与值转换成一个json对象

function getRequest(){
   var url=location.search;
   var jsonList={};
   if(url.indexOf("?")!=-1){
   var str=url.slice(url.indexOf("?")+1);
   var strs=str.split("&");
   for(var i=0;i<strs.length;i++){
   jsonList[strs[i].split("=")[0]]=strs[i].split("=")[0];
 }
}
return jsonList;
}
console.log(getRequest());

最后

以上就是腼腆奇异果为你收集整理的js部分面试题的全部内容，希望文章能够帮你解决js部分面试题所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。