Javascript 基础知识

1.如何在一个对象上添加属性？

方法一：var b = {};
b["name"] = "test";
delete b.name 删除对象的属性

delete 运算符可以用来删除对象的属性，如歌对象包含该属性，那么该属性就会被移除。

方法二：b.name ="test";

2.如何判断一个变量是否声明？

typeof(a) =="undefined"

typeof(d) =="function" 是否为函数也可以不用括号 typeof a 没加括号，必须要空格。

3.怎么表示为字符串? 通过双引号("")，单行号(''),反斜杠(//)

1+"1"=="11"
1+'1'==11

4.Javascript 只有一个数字类型。

5.Javascript的基本数据类型？

number(数字),string（字符串）,Boolean（布尔）,undefined（未定义）,Null(空)

另外：Object（对象）

6.类和对象的区别？如何用javascript实现？

function myClass()
{ }

myClass.prototype.ID = 1;
myClass.prototype.Name = "johnson";
myClass.prototype.showMessage = function()
{
alert("ID: " + this.ID + "Name: " + this.Name);
}

var obj1 = new myClass();
obj1.showMessage();

7. JavaScript 中，有多少种不同类型的循环？

两种。for 循环和 while 循环。

8.数组的类型为Object。

如何删除数组的成员？

var a=["12","2","3"];
delete a[0]; true 这样不对，应该a.splice(0,1); a ["2", "3"]

可以给Array原型上添加方法

Array.prototype.remove = function (val) {
      var index = this.indexOf(val);
       if (index > -1) {
            this.splice(index, 1);
       }
};

a.remove("3"); //移除数组a中的“”3“”；

9.一个数组的的成员类型里可以有字符串，数字，方法，空。

10.NaN 数字表示非数字，

返回True 就不是数字，可以判断一个变量是否为数字类型。 alert(typeof(a));//number

a. not a number（不是一个数字的数字类型）

b. 程序中出现:NaN肯定进行了非法的运算操作 alert('200px'-100);

c.NaN 是false if(NaN)

d.NaN与自己都不相等 var a = Number('abc'); alert(a===a )//false;

11.parseInt() 函数可解析一个字符串，并返回一个整数。

12.Array.push(item)，push 方法把一个或多个参数item附加到一个数组的尾部。如果参数item是一个数组，它会把参数数组作为单个元素整个添加到数组中，并返回这个array的新长度值。

var new_sortArray = new Array();//实例化数组

也可以这样定义数组var new_sortArray=[];

var obj = new Object();//实例化对象

obj.id = accFind.New_sort.Id;
obj.name = accFind.New_sort.Name;
obj.typename = accFind.New_sort.LogicalName;
new_sortArray.push(obj);//将对象添加到数组中。

13. function add(){}

(1).var a = add(); 输出：undefined 未定义

(2).var a= new add(); 输出：[object] {} 对象

(3). var a = add; 输出：function add(){} 函数

14.hasOwnProperty：是用来判断一个对象是否有你给出名称的属性或对象。不过需要注意的是，此方法无法检查该对象的原型链中是否具有该属性，该属性必须是对象本身的一个成员。

15.isNaN 可以辨别数字和NaN
isNaN(NaN) //true
isNaN(0) //false
isNaN('abdd') //true
isNaN('0') //false
isNaN(null); //false
isNaN(undefined); //true
isNaN(""); //false
isNaN(true) //false
isNaN(false) //false
if(isNaN(str)){
alert(str + '不是数字');
}else
{
alert(str + '是数字');

//alert(isNaN('250'));//fale

因为Number(); '250'=> 250 => false

判断一个值否是可用做数字的最佳方法是使用isFinite函数，因为它会筛选掉NaN和Infinity
var isNumber = function isNumber(value)
{
reutn typeof value == 'number' && isFinite(value);
}

if (isNaN(new_total_amount))//如果值为未定义，则置为0
{
new_total_amount = 0;
}

16.创建一个对象obj,该对象包含一个名为“name”的属性，其值为“value”,有哪些方法？

方法一：var obj = new Object(); obj["name"] = "value";

方法二：var obj = {name : "value"};

方法三: var obj = new function(){this.name="value";}

注意：var obj = new Object(); obj.prototype.name = "value";此方法不行。obj用在function上，obj不存在prototype对象

Object.prototype.name = "value";这样可以。Object是个“类”，当然可以。但ＪＳ没类这个说法。你 var obj = new Object();后的obj是个对象。function就是个“类”

17.with 语句为一个或一组语句指定默认对象。

用法：with (<对象>) <语句>;

with 语句通常用来缩短特定情形下必须写的代码量。在下面的例子中，请注意 Math 的重复使用：

x = Math.cos(3 * Math.PI) + Math.sin(Math.LN10);
y = Math.tan(14 * Math.E);

当使用 with 语句时，代码变得更短且更易读：

with (Math) {
x = cos(3 * PI) + sin(LN10);
y = tan(14 * E);
}

18.

this 对象返回“当前”对象。在不同的地方，this 代表不同的对象。如果在 JavaScript 的“主程序”中（不在任何 function 中，不在任何事件处理程序中）使用 this，它就代表 window 对象；如果在 with 语句块中使用 this，它就代表 with 所指定的对象；如果在事件处理程序中使用 this，它就代表发生事件的对象。

一个常用的 this 用法：

这个用法常用于立刻检测表单输入的有效性。

19.去除列表中选择的重复值,并将多个值拼接成"1,2"这样的形式。

var orderCodeFilter = {};//定义一个对象，相当于new Object();
var orderCoders = [];
var datas = [{OrderCodeStr:"1,",id:1},{OrderCodeStr:"1,",id:2},{OrderCodeStr:"2,",id:3},{OrderCodeStr:"2,",id:4},{OrderCodeStr:"3,",id:5},{OrderCodeStr:4,id:6},{OrderCodeStr:4,id:7}];
 
for (var i = 0; i < datas.length; i++) {
    var tempOrderCodeStr = datas[i].OrderCodeStr;
    var key;
    //找到tempOrderCodeStr最后一个字符串
    var lastStr = tempOrderCodeStr.substring(tempOrderCodeStr.length - 1, tempOrderCodeStr.length);
    if (lastStr == (",")) {
       //去除tempOrderCodeStr最后一个字符串
       key = tempOrderCodeStr.substring(0, tempOrderCodeStr.length - 1);
    }else{
       key = tempOrderCodeStr;
    } 
    //判断，不存在重复的属性值  注意 key需要去除前后空格
    if(!orderCodeFilter[key]){
       //将属性值添加到对象末尾
       orderCoders.push(key);
       //属性值赋给对象,
       orderCodeFilter[key] = key;
    }
}

var orderCodeStr = orderCoders.join(",");/"1,2,3,4"

20. "PayTime":"\/Date(1413532617000+0800) 这个时间格式怎么理解？

+0800:为东八区
1413532617000：为总毫秒数

比如今天的时间为：2014/10/17 星期五
var d = new Date();
d.toDateString(); "Fri Oct 17 2014"
d.getTime();

则格式为"PayTime":"\/Date(1413535530809+0800)

21.JS中允许“.”替换成“[]”

比如 document.getElementById("bg").style.width = '100px';

相当于document.getElementById("bg").style['width'] = '100px';

22. JS中的数据类型:数字、字符串、布尔、函数、对象(obj（window） [](数组) {}(JSON) null(空) ) 、undefined(未定义)

  var a = 1;
  if(){  
  }
  typeof 判断数据类型
  */
  var i = 100;
  //alert(typeof i);
  
  var s = ' miaov';
  //alert(typeof s); //string
  //alert(s.length);//7
  //alert(s.charAt(3));'a'
  
  var b = true;//布尔值
  //alert(typeof b);//boolean
/*  if(12 < 90){
  }*/
  
  //for(;false;){}
   var fn = function(){ alert(1);};
   //alert(fn());
   //fn
    function fn1(){
      alert(2);    
    }
    //alert(fn1);
     
  //var obj = window;
  //alert(typeof obj); //object 物体，东西,对象     
    var obj = document;
    //alert(typeof obj);
    obj.abc = 123;
    obj.onOff = true;
    //alert(document.abc); 
     obj.fn1 = function() { alert(1);};
     //obj.fn1();
     
  var arr = [1,2,3,4]
  //alert(arr.length);
  //arr[2] = 345;
  //alert(arr[2]); 
  //arr.push(5,6,7);
  //alert(arr);
  //alert(typeof arr);//object
  arr.abc = 999;
  arr.fn1 = function() { alert(1);}
  //alert(arr.abc);
  //arr.fn1();
  
  var json = { name:'maiov',age:5};
  //alert(json.name + '今年'+ json.age +'岁了');
  //alert(typeof json);json 
  
  var n = null;
  //alert(typeof n);//object 
  //n.abc = 123;//不可以
  //alert(n.abc);//不可以
  var u;
  alert(u);//typeof 
  //alert(typeof u);//undefined(未定义)
  //表示你写的程序出问题了

23. 显示类型转换（强制类型转换）

Number();
parseInt();
parseFloat()

var num = '200.345';
if(parseInt(num) == parseFloat(num)){
alert(num +'是整数');
}else
{ alert(num +'小数');
}

24.隐式类型转换

- * / % '200' - 3 变成数字 2003
+ '200'+ 3 变成字符串 197

++ -- 变成数字
> < 数字的比较和字符串的比较

! 取反把右边的数据类型转成布尔值

alert('10' > '9');//false
alert('10' > 9) true

25.作用域

1） ”找一些东西“：var function 参数

a=1 所有的变量，在正式运行代码之前，都提前赋了一个值：未定义

fn1 = function fn1(){ alert(2);}

所有的函数，在正式运行代码之前，都是整个函数块。

遇到重命名的：只留一个。

变量和函数重名了，只留函数。

2）逐行解读代码

表达式：= + - * / % ++ -- ! 参数.....

表达式可以修改预解析的值.

3)题目：

alert(a);
var a = 1;
alert(a);
function a(){ alert(2);}
alert(a);
var a = 3;
alert(a);
function a() { alert(4);};
alert(a); 弹出的值为什么？

1）预解析：var function 参数 ......
           剔除 a= undefined
           剔除 a = function a（） { alert(2);}
           剔除 a = undefined
                a = function a() { alert(4);}
            
           a= 1 
2) 逐行解读代码：
       表达式：

alert(a);  //function a() { alert(4);
var a = 1; 
alert(a); //1
function a(){ alert(2);} //没改变
alert(a); // 1
var a = 3;
alert(a); //3 
function a() { alert(4);};//函数声明，不能改变值。
alert(a); //3

var a =1;
function fn1(){
alert(a);//undefined
var a = 2;
}
fn1();
alert(a);//1

26.

真假的问题：数据类型-数字（NaN）、字符串、布尔、函数、对象（elem、[]、{}、null）、未定义
真：非0的数字，非空字符串、true、函数，能找到的元素、[]、{}
假：0 、（'abc'-1）NaN、空字符串、false、不能找到的元素、未定义

if('')
{
alert('真');
}else
{
alert('假');
}

27.return :返回值

1)函数名+括号：fn1()==>return 后面的值；
2)所有函数默认返回值：未定义;
3)return 后面的任何代码都不执行了；

28.

//当函数的参数个数无法确定的时候：用arguments
function sum(){
var n = 0;
for(var i=0;i<arguments.length;i++){
n += arguments[i];
}
return n;
}

29.

background: url() red …… 复合样式（不要获取）
backgroundColor 单一样式（不要用来做判断）

不要有空格

不要获取未设置后的样式：不兼容

 function $(v){
     if(typeof v === 'function'){
       window.onload = v;
     }else if(typeof v === 'string')
     {
        return document.getElementById(v);     
     }
     else if(typeof v === 'object')
     {
        return v;
     }
 }

getComputedStyle // IE6 7 8 不兼容(获取到的是计算机（浏览器）计算后的样式)
currentStyle    //标准浏览器不兼容
function getStyle(obj,attr)
{
  return obj.currentStyle ? obj.currentStyle:getComputedStyle(obj)[attr];
}

30.定时器

定时器：时间概念
var timer = setInterval(函数,毫秒); //重复执行
clearInterval(timer);//清除

var timer = setTimeout(函数，毫秒);//执行一次

31.

//x~y 之间的随机数
Math.round(Math.random()*(y-x) +x);

32.数组去重

var arr = [ 1,2,2,4,2 ];

for ( var i=0; i<arr.length; i++ ) {
for ( var j=i+1; j<arr.length; j++ ) {
if ( arr[i] == arr[j] ) {
arr.splice( j, 1 );
j--;
}
}
}
alert( arr );

33. for in (相当于C#中的foreach)

var str = '';
var num = 0;
for ( var attr in document ) {
str += num + '. ' + attr + ':' +document[attr] + '<br />';
num ++;
}
document.body.innerHTML = str;
</script>

34、减少Dom 操作的方法

1.节点克隆 --cloneNoew。

window.onload = function(){
   var oUl = document.getElementById('ul1');
   var str = '';
   console.time('hello');
   for(var i=0;i<5000;i++){
      var oLi = document.createElement('li');
      oLi.innerHTML = 'li';
      oUl.appendChild(oLi);
   }
   console.timeEnd('hello');
  
   console.time('hello');
   var oLi = document.createElement('li');
   oLi.innerHTML = 'li';
   for(var i=0;i<5000;i++){
      
      
      var newLi = oLi.cloneNode(true);
      
      oUl.appendChild(newLi);
    }
    console.timeEnd('hello');

}

2.访问集合 -- 尽量使用局部变量。

var doc = document;
var odiv = doc.getElementById();
var oInput = doc.getElementById();

window.onload = function(){
  var oDiv = document.getElementById('div1');
  
  var L = oDiv.offsetHeight;
  var T = oDiv.offsetTop;    
  setInterval(function(){
    L ++;
    T ++;

      oDiv.style.left = L + 1 +'px';
      oDiv.style.top = T + 1 +'px';
     
  },30)
};

3.元素节点 -- 尽量用只获取元素的节点方法

appendChild
childNodes -> 元素节点,文本节点
children -> 元素节点
firstChild
firstElementChild

4.选择器 API --利用querySelector,querySelectorAll

var oUl = document.getElementById('ul');
var aLi = oUl.getElementsByTagName('li');

//IE 8以下不支持
var aLi = document.querySelectorAll('#ul li');

5. Chrome: dom方法要比innerHTML性能要好，IE浏览器

6. createDocumentFragment 的使用

window.onload = function(){
  var oUl = document.getElementById('ul1');
  var oFrag = document.createDocumentFragment();//作为缓存
  
  console.time('hello');//Firefox测试输出的时间

for(var i= 0;i<5000;i++) { var oLi = document.createElement('li'); oFrag.appendChild(oLi); } oUl.appendChild(oFrag); console.timeEnd('hello');//Firefox输出的时间 };

7.cssText代替 oLi.style.width

window.onload = function(){
   var oUl = document.getElementById('ul1');

   console.time('hello');
   for(var i =0; i < 5000;i++)
   {
      var oLi = document.createElement('li'); 
      oLi.style.width = '100px';
      oLi.style.height = '100px';
      oLi.style.background = 'red';
      //oLi.style.cssText ='100px;height:100px;background:red';
      oUl.appendChild(oLi);
      
   }    
   console.timeEnd('hello');   
}

35、快速排序

1.找一个基准点.
2.建立两个数组、分别存储左边和右边的数组.
3.利用递归进行下次比较.

// 快速排序
function quickSort(arr){    
   if(arr.length <= 1){
      return arr;
   }
    
   var num = Math.floor(arr.length/2);
   var numValue = arr.splice(num,1);
   
   var left = [];
   var right = [];
   
   for(var i =0;i < arr.length;i++){
       if(arr[i] < numValue){
          left.push(arr[i]);
       }else {
          right.push(arr[i]);
       }
   }
    
   return quickSort(left).concat([numValue],quickSort(right));    
   
}

alert(quickSort([12,5,37,6,22,40]));

也可以用sort()来处理

  var arrWidth = ['345px','23px','10px','1000px'];
  arrWidth.sort(function(a,b){
    return parseInt(a) - parseInt(b);      
  });
  //alert(arrWidth);
  
  var arr =[1,2,3,4,5,6,7,8];
  arr.sort(function(a,b){
    return Math.random() - 0.5;
  });
  
  alert(arr);

36、函数声明与表达式

函数声明：function 函数名（）{}

函数表达式:function 函数名（可写可不写）(){} :命名函数表达式匿名函数表达式
function aaa(){} :函数声明

var a = function aaa() {} :命名函数表达式
var a = function() {} :匿名函数表达式

{function aaa(){}}:表达式
区别：
1. 函数表达式可以直接后面加括号执行，而函数声明是不可以的。
2.函数声明可以被提前解析出来的
function aaa(){ alert(1);}();

var a = function aaa(){ alert(1)}();
~function aaa() { alert(1)}();

37、JS操作IFrame

1. contentDocument

2.contentWindow.document

3.window.parent

4.window.top

/document 操作iframe
window.onload = function(){
var oInput = document.getElementById('input1');
var oIframe = document.getElementById('iframe1'); 

oInput.onclick = function(){
//oIframe.contentWindow.document.getElementById('div1').style.color = 'red'; //所有的浏览器都支持

oIframe.contentDocument.getElementById('div1').style.background = 'red'; //IE6,7不支持
}; 
};

var oIframe = document.createElement('iframe');
oIframe.src = 'iframe1.html';
document.body.appendChild(oIframe);

/* oIframe.onload = function()
{
alert(123); 
};*/

//ie 下的iframe 的onload事件只能用绑定的形式
oIframe.attachEvent('onload',function(){
alert(123); 
});

iframe 改变高度：

window.onload = function(){
    var aInput = document.getElementsByTagName('input');
    var oIframe = document.getElementById('iframe1');
    
    function changeHeight(){
       setTimeout(function(){
            oIframe.height = oIframe.contentWindow.document.body.offsetHeight;
           },100);    
    }
      
    changeHeight();  
    
    aInput[0].onclick = function(){
        oIframe.src = 'iframe4.html';
        changeHeight();  
    };
    
    aInput[1].onclick = function(){
        oIframe.src = 'iframe5.html';
        changeHeight();  
    };
};

5.iframe的高度随嵌套页面高度的变化为变化

$(window.frames["iframe1"].document).height() //iframe1为iframe的名称

如果同个页面不在同一个站点下，会出现跨域问题，报：Blocked a frame with origin from accessing a cross-origin frame

解决方法如下：

parent page:
window.addEventListener('message', function (event) {
    if (event.data.viz == "Dis") {
        var data = event.data;
        document.getElementById('emViz_disparities').height = data.height;
    }
}, false);

child page:

window.parent.postMessage({
    'height': framewidth + 180,
    'viz': 'Dis',
    'location': window.location.href
}, "*");

参考：https://forums.asp.net/t/2119174.aspx?Blocked+a+frame+with+origin+from+accessing+a+cross+origin+frame+

38.js获取最顶层Id的html

$("#顶级框架的id",top.window.document).html();

39.获取URL的参数

function getQueryString(name) {
        var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
        var r = window.location.search.substr(1).match(reg);
        if (r != null) return unescape(r[2]); return null;
    }

获取url后?的参数

var getRequest = function () {
    var url = location.search; //获取url中"?"符后的字串
    var theRequest = new Object();
    if (url.indexOf("?") != -1) {
        var str = url.substr(1);
        strs = str.split("&");
        for (var i = 0; i < strs.length; i++) {
            theRequest[strs[i].split("=")[0]] = unescape(strs[i].split("=")[1]);
        }
    }
    return theRequest;
}

40.javascript:void(0)表示不做任何动作

<a href="javascript:;">Test</a>
可以用javascript:;代替 javascript:void(0);

41.去掉js数组中的重复项 http://www.jb51.net/article/82293.htm

Array.prototype.unique3 = function(){  
    var res = [];
    var json = [];
    for(var i=0,len = this.length;i<len;i++)
    {
       if(!json[this[i]]){
              res.push(this[i]);
              json[this[i]] = 1;
       }
    }
    return res;
};
var arr2 = [1, 1, 3];
arr2.unique3();

var Uniue =  function(arr)
    {
        var result = [], hash = {};
        for (var i = 0, elem; (elem = arr[i]) != null; i++) {
        if (!hash[elem]) {
        result.push(elem);
        hash[elem] = true;
        }
        }
        return result;
    };

42.javascript 实现嵌套页面(内容很多，出现滚动条)的打印。主要代码如下:

父页面代码：

<script>
function printdiv() {
    window.open("/Print.html?t=" + Math.random(),"newwindow", "height=2000, width=1024, toolbar =no, menubar=no, scrollbars=no, resizable=no, location=no, status=no");
}
</script>
<a  onclick="printdiv();">预览</a>
<div id="div_print">
    打印内容
</div>

子页面代码：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>打印test</title>
    <script language="javascript">
        window.onload = function () {
            var opn = window.opener;
            var printpage = opn.document.getElementById("div_print").innerHTML;//获取父页面标签的值

            var newstr = document.getElementById("printidiv").innerHTML = printpage;
        }
    </script> 
</head>
<body>
    <a href="javascript:window.print();">打印</a>
   <div id="printidiv">

   </div>
</body>
</html>

另外设置打印的css代码，通过media="print"来区分

这样打印会有问题:1.会出现url地址，手动设置去掉页眉页脚，会把页码也去掉；2.预览之后打印页面需要重新写JS和CSS 可以使用Jquery 的print 来实现打印。

2.window.print打印指定网页区域的方法 http://www.52jb.net/biancheng/517.html

https://stackoverflow.com/questions/9616426/javascript-print-iframe-contents-only

43.隐私信息用**代替

 return function (input, begin, charLen) {//charLen代替*的个数，begin是从1开始
            if (!input) return '';
            var len = input.length;
            if (begin <= 0) {
                begin = 1;
            }
            if (begin > len) {
                return input;
            }
            var char = '*';
            var fstStr = input.substring(0, begin - 1);
            var lstStr = "";
            if(charLen<0) {
                charLen = 1;
            }
            if (!charLen) {
                charLen = len - begin+1;
            }
            var end = begin + charLen;
            var scdStr = input.substr(begin-1, charLen);
            if (end <= len) {
                lstStr = input.substr(end - 1);
            }
            var output = fstStr + scdStr.replace(/[u4E00-u9FA5A-Za-z0-9_]/g, char) + lstStr;
            return output;
        };

44.数组方法合集

1).一维数组去重

方法一

//去除前后空格
function Trim(str)
 { 
  return str.replace(/(^s*)|(s*$)/g, ""); 
}
//一维数组去重
var unique = function(array){
   array = array || [];
   for (var i = 0, len = array.length; i < len; i++) {
      for(var j = i+1;j< array.length;j++){
         if(Trim(array[i]) === Trim(array[j])){
             array.splice(j,1);
             j--;
         }
      }
   }
   return array;
}
var arrt = ['1','2','3','1','2','3'," 1"," 2"," 3"];
var t2 = unique(arrt);//['1','2','3']

方法二

/*
*对数组进行去重操作，返回一个没有重复元素的新数组
*/
function unique(target) {
    var result = [];
    loop: for (var i = 0, n = target.length; i < n; i++) {
        for (var x = i + 1; x < n; x++) {
            if (target[x] === target[i]) {
                continue loop;
            }
        }
        result.push(target[i]);
    }
    return result;
}

方法三

Array.prototype.distinct = function () {
    var newArr = [],obj = {};
    for(var i=0, len = this.length; i < len; i++){
        if(!obj[typeof(this[i]) + this[i]]){
            newArr.push(this[i]);
            obj[typeof(this[i]) + this[i]] = 'new';
        }
    }
    return newArr;
}

其实最优的方法是这样的

方法四

Array.prototype.distinct = function () { 
    var sameObj = function(a, b){ 
        var tag = true; 
        if(!a || !b) return false; 
        for(var x in a){ 
            if(!b[x]) return false; 
            if(typeof(a[x]) === 'object'){ 
                tag = sameObj(a[x],b[x]); 
            } else { 
                if(a[x]!==b[x]) 
                return false; 
            } 
        } 
        return tag; 
    } 
    var newArr = [], obj = {}; 
    for(var i = 0, len = this.length; i < len; i++){ 
        if(!sameObj(obj[typeof(this[i]) + this[i]], this[i])){ 
        newArr.push(this[i]); 
        obj[typeof(this[i]) + this[i]] = this[i]; 
        } 
    }

方法五

//可传参的类似C#的distinct去重
Array.prototype.distinct = function () {
    var callback = arguments[0] || function (n) { return n; };
    var arr = [];
    var resultArr = [];
    for (var i = 0, len = this.length; i < len; i++) {
        var resultItem = callback(this[i]);
        if (!~resultArr.indexOf(resultItem)) {
            resultArr.push(resultItem);
            arr.push(this[i]);
        }
    }
    return arr;
};

使用

var arr=[{name:"tom",age:12},{name:"lily",age:22},{name:"lilei",age:12}];
var newArr=arr.distinct(function(ele){
  return ele.age;
});

参考：http://www.cnblogs.com/liyunhua/p/4558621.html

2).获取数组中最大的项

Math.max.apply(null, array);

3).获取数组中最小的项

Math.min.apply(null, array);

4).清空数组

(array || []).length = 0;

5).获取两个数组之间相同的，不同的和合并之后去掉重复的数组

var getSampleArr = function (newValue, oldValue) {
    var arry3 = new Array();
    var j = 0;
    for (var i = 0; i < newValue.length; i++) {
        for (var k = 0; k < oldValue.length; k++) {
            if (newValue[i] == oldValue[k]) {
                arry3[j] = newValue[i];
                ++j;
            }
        }
    }
    return arry3;
};
var getDiffArr = function (newValue, oldValue) {
    var newArr = [];
    if (newValue.length > 0 && oldValue.length <= 0) {
        newArr = newValue;
    }
    var arr3 = [];
    for (var i = 0; i < newValue.length; i++) {
        if (oldValue.indexOf(newValue[i]) === -1)
            arr3.push(newValue[i]);
    }
    var arr4 = [];
    for (var j = 0; j < oldValue.length; j++) {
        if (newValue.indexOf(oldValue[j]) === -1)
            arr4.push(oldValue[j]);
    }
    newArr = arr3.concat(arr4);
    return newArr;
};
var getUniqueArr = function (newValue, oldValue) {
    var arr = newValue.concat(oldValue);
    var result = [], hash = {};
    for (var i = 0, elem; (elem = arr[i]) != null; i++) {
        if (!hash[elem]) {
            result.push(elem);
            hash[elem] = true;
        }
    }
    return result;
};

45. 前端处理倒叙问题

 //一般这样写
 for (var i = 0; i < data.Data.length; i++) {
 
 }
//如果要倒叙
for (var i = data.Data.length - 1; i >= 0; i--) {
    
}

46.JS中(function(){xxx})(); 这种写法是什么意思：https://segmentfault.com/q/1010000000135703

自执行匿名函数：

常见格式：(function() { /* code */ })();
解释：包围函数（function(){})的第一对括号向脚本返回未命名的函数，随后一对空括号立即执行返回的未命名函数，括号内为匿名函数的参数。
作用：可以用它创建命名空间，只要把自己所有的代码都写在这个特殊的函数包装内，那么外部就不能访问，除非你允许(变量前加上window，这样该函数或变量就成为全局)。各JavaScript库的代码也基本是这种组织形式。

总结一下，执行函数的作用主要为匿名和 自动执行,代码在被解释时就已经在运行了。

其他写法

(function () { /* code */ } ()); 
!function () { /* code */ } ();
~function () { /* code */ } ();
-function () { /* code */ } ();
+function () { /* code */ } ();

推荐阅读：立即调用的函数表达式

47. 原型和闭包

原型就是C#中类的公有方法

闭包就是C#中类的私有属性

（function(){……………}()）最简单的闭包

什么情况使用闭包

防止方法里面的变量被外面的变量改变。

48.不声明第三个变量的值交换
var a = 1, b = 2; a = [b, b = a][0];

49.循环中使用标签

有时候循环当中嵌套循环，你可能想要退出某一层循环，之前总是用一个标志变量来判断，现在才知道有更好的方法

outerloop:
for (var iI=0;iI<5;iI++) {
　　if (somethingIsTrue()) {
　　// Breaks the outer loop iteration
　　break outerloop;
　　}
　　innerloop:
　　for (var iA=0;iA<5;iA++) {
　　　　if (somethingElseIsTrue()) {
　　　　// Breaks the inner loop iteration
　　　　break innerloop;
　　}
　　}
}

50.基础数据类型(Null,Undefined,Number,Boolean,String)不可以改变，对象可以改变；(只能引用类型值动态的添加属性)

var a ='abcd';
undefined
a.len = 4;
4
alert(a.len) undefined 只有对象才有方法
undefined
a.toUpperCase() 转为大写
"ABCD"
alert(a);还是小写的abcd
undefined
a = a.toUpperCase();是大写的ABCD
"ABCD"
alert(a);
undefined

如下图：

51. 当你用if去判断时， null、undefined、''、0会自动转换为false 。三元表达式也是一样的

52. push() 往数组最后面添加一个元素，成功返回当前数组的长度
pop() 删除数组的最后一个元素，成功返回删除元素的值
shift() 删除数组的第一个元素，成功返回删除元素的值
unshift() 往数组最前面添加一个元素，成功返回当前数组的长度
splice() 有三个参数，第一个是想要删除的元素的下标（必选），第二个是想要删除的个数（必选），第三个是删除后想要在原位置替换的值（可选）
sort() 使数组按照字符编码默认从小到大排序,成功返回排序后的数组
reverse() 将数组倒序，成功返回倒序后的数组

53.

按拉计算，先是转换成二进制，0和1
按位非(NOT ！) 是将所有的0转成1，1转成0

按位与(AND &) 是 1和1转成1; 1和0，0和1，0和0转成0

按位或(OR | ) 是 1和1，1和0，0和1转成1，0和0转成0
按位异或(XOR ^ ) 是 1和1，0和0转成0；1和0，0和1都转成1

54.判断点击第几个按钮JS代码的三种方法

方法一：使用下标实现
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <script type="text/javascript">
            window.onload = function () {
                var btns = document.getElementsByTagName("button");
                for (var i=0, length=btns.length; i<length; i++) {
                    var btn = btns[i];
                    //将btn所对应的下标保存在btn上
                    btn.index = i;
                    btn.onclick = function () {
                        alert('第'+(this.index+1)+'个');
                    };
                }
            }
        </script>
    </head>
    <body>
        <button>测试1</button>
        <button>测试2</button>
        <button>测试3</button>
    </body>
</html>

方法二：使用闭包实现（闭包的作用可以延长局部变量的生命周期）
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <script type="text/javascript">
            window.onload = function () {
                var btns = document.getElementsByTagName("button");
                //利用闭包实现循环遍历+监听
                for (var i=0, length=btns.length; i<length; i++) {
                    (function(i) {
                        var btn = btns[i];
                        btn.onclick = function () {
                            alert('第'+(i+1)+'个');
                        };
                    })(i)
                }
            }
        </script>
    </head>
    <body>
        <button>测试1</button>
        <button>测试2</button>
        <button>测试3</button>
    </body>
</html>

方法三：利用ES6实现（let有自己的块作用域）
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <script type="text/javascript">
            window.onload = function () {
                var btns = document.getElementsByTagName("button");
                //利用let定义i
                for (let i=0, length=btns.length; i<length; i++) {
                        var btn = btns[i];
                        btn.onclick = function () {
                            alert('第'+(i+1)+'个');
                        };
                }
            }
        </script>
    </head>
    <body>
        <button>测试1</button>
        <button>测试2</button>
        <button>测试3</button>
    </body>
</html>

5.indexOf和lastIndexOf

第二个参数是搜索的起始位置，注意在javascript中利用indexOf和lastIndexOf对数组搜索，即使设置了第二个参数，也不是说搜索到数组最后一个元素就停止，而是会循环搜索（相当于把前面的元素接到后面继续搜索），即无论如何都会对所有的元素搜索一遍。
我在多种浏览器中（IE、firefox和chrome中输出都是3、5、5、3，你怎么会是3、5、3、3？）

var a=[1,2,3,4,5,4,3,2,1]

console.log(a.indexOf(4)) //3
console.log(a.lastIndexOf(4)) //5
console.log(a.indexOf(4,4))//5，从位置4开始搜索，位置5元素就是4，搜索停止，故输出5
console.log(a.lastIndexOf(4,4))//3，从位置4开始搜索，先搜索位置5元素符合，最后搜索到位置3元素符合，故输出3

数组的.indexOf方法，对于引用型的对象，是按对象的引用比较的

morePeople[0]与person是同一个对象的引用

people[0]与person是两个不同的对象，虽然对象的内容一样

var person ={name:"n"}
var people=[{name:"n"}];
var morePeople=[person];

alert(people.indexOf(person)) ; //-1
//people里没有person对象，当然返回-1

alert(morePeople.indexOf(person)); //0
//morePeople里第0个元素就是person，所以返回所在位置0

6.window.top/window.self

if (window.top !== window.self) { window.top.location = window.location; }
判断当前的窗口是不是顶层窗口
换句话说，判断当前的窗口有没有被嵌套在别的窗口中
如果window.top = window.self 没嵌套
当前窗口就是顶层窗口

top.location != self.location 就是说当前窗体的url和父窗体的 url是不是相同
如果相同执行top.location=self.location;}，把窗体的url设成和本窗体一样。这个是为了防止别的网站嵌入你的网站的内容（比如用iframe嵌入的你的网站的页面）

7.引入的js 需要加入版本号 ?(new Date()).getTime()

8.var book=function(){} https://zhuanlan.zhihu.com/p/83691879
book.name="2"
var book=function(){}
book.prototype.name="1"
这个有啥区别？

prototype 是全局的，book.name="2" 是单个的

book.name="2" 是本地属性
book.prototype.name="1" 是给原型链加属性

使用 prototype 时在当前 book 对象没有找到 name 时会到父级去找，没有找到一直往上找，直到最后一个；

如果book没有父级的话，就没有区别；

没找到就是 undefined 呀；

不要给原生对象加原型方法，因为加到原型链上，会在整个js环境都发生改变 ,那怎么处理？你自己写一个方法，调用原生函数再处理数据；

原生函数：

在子类中可以使用父类的属性

不需要在子类中再定义

使用prototype的好处是不会产生额外的内存，所有实例化后的对象都会从原型上继承这个属性或方法。当一个子类需要拥有父类的某些属性或方法，该属性或方法可以覆盖，又可以添加自己的属性和方法，这个操作不影响父类，这个时候使用prototype。

推荐书籍《JavaScript 语言精粹》电子工业出版社 Douglas Crockford 著赵泽欣鄢学鹍译

你自己写一个方法，调用原生函数再处理数据