javascript

函数

• 函数的参数如果是原始类型数据，数值，字符串，布尔值。传值操作。
• 函数的参数是复合类型的数据，函数，对象，传址操作。
• 同名参数:

function f(a, a) {
  console.log(a);
}

f(1, 2) // 2

• arguments对象包含了函数运行时的所有参数，arguments[0]就是第一个参数，arguments[1]就是第二个参数，以此类推。这个对象只有在函数体内部，才可以使用。
• arguments是对象，转化为数组的方法如下：

var args = [ ] ;
for (var i = 0; i<arguments.length; i++) {
		args.push(arguments[i];
		}

• IIFE 立即执行的函数表达式 ：作用：避免污染全局变量
• 数组

 var arrs = "songjianjiang";
// var arr = [1, 3, 4, 5];
// arr.p = "test";
// 数组是特殊的对象，返归的键是0开始的有序整数
// 对于数值的键名，不能使用点结构。
// length属性是可写的。如果人为设置一个小于当前成员个数的值，该数组的成员会自动减少到length设置的值。
// arr.length = 0; //清除数组可以使他的length为0；
// console.log (Object.keys(arr));
// // 数组的遍历
// 第一种，使用for in 遍历。缺点会遍历出非整数键的值；加了IIFE
// (function () {for (var i  in arr) {
//     console.log (i);
// }}());
// 第二种使用foreach
// arr.forEach(function (value){
//   console.log (value)
// } );
// 类似数组的对象
var arr = Array.prototype.slice.call(arrs);
arr.forEach(function (chr) {
  console.log(chr);
});

数组去重

 //数组去重
     var arr = [undefined,undefined,'song','song','zhu','zhu',22,22,1,1,33,33];
     Array.prototype.removeDul = function () {
         var obj = {};
         var arr = [];
         for (var i = 0; i<this.length;i++) {
            if(!obj[this[i]]) {
                obj[this[i]] = "song";
                arr.push(this[i]);

            }
         }
         
         return arr;

     }

立即执行函数与闭包应用

function test() {
      var arr = [];
      for (var i =0; i<10; i++) {

        (function (j) {
            arr[j] = function () {
              console.log(j);
            }
        }(i));
        }
    
      return arr;
  }
  var temp = test();
  for (var j = 0; j<temp.length; j++) {
      temp[j]();
  }    

类数组

  var arr = {
       0 : 's',
       1 : 'o',
       2 : 'n',
       length : 3,
       push : function (a) {
           this[this.length]=a;
           this.length++;
       },
       splice : Array.prototype.splice
   }

返回元素标签 的第n层父级元素

 # 返回元素标签 的第n层父级元素

var div = document.getElementsByTagName('div')[0];
//getElementsByTagName定义在Document和Element.prototype上
  var i = div.getElementsByTagName('i')[0];
  function retParent(elem,n) {  
      while (elem && n) {
        elem = elem.parentElement;
        n--;
      }
      return elem;
       
  }

返回元素节点的孩子元素节点

var div = document.getElementsByTagName('div')[0];
    // 返回元素节点的孩子元素节点
    Element.prototype.myChild = function () {
        var arr = [];
        var len = this.childNodes.length;
        var child = this.childNodes;
        for (var i = 0; i < len; i++) {
            if (child[i].nodeType == 1) {
                arr.push(child[i]);
            }
            
        }
        return arr;
    }

insertAfter函数的封装

  //insertAfter函数的封装
        var div = document.getElementsByTagName('div')[0];
        var p = document.getElementsByTagName('p')[0];
        var span = document.createElement('span');
      
   Element.prototype.insertAfter = function (elem,htmlElem) {
    var nextNode = htmlElem.nextElementSibling;
        if (nextNode == null) {
            this.appendChild(elem);
        }else {
            this.insertBefore(elem,nextNode);
        }
       
   }

继承模式之圣杯模式

 //圣杯模式（继承）
  Father.prototype.name = "songjianjiang";
  function Father() {

  }
  function Son() {

  }

  var inherit = (function () {
    function F() {}
    return function (target,origin) {
        F.prototype = origin.prototype;
        target.prototype=F.prototype;
        target.prototype.constructor = target;
        target.prototype.uber = origin.prototype;
    }
  }());
  inherit(Son,Father);
  var son = new Son();

计数器例子

  // 计数器
    var minutes = document.getElementsByTagName('input')[0];
    var seconds = document.getElementsByTagName('input')[1];
    var button = document.getElementsByTagName('button')[0];


    
    var timer = setInterval(function () {
        seconds.value ++;
        if (seconds.value == 60) {
          seconds.value = 0;
          minutes.value++;
        }
       button.function () {
         clearInterval(timer);
         button.style.backgroundColor = 'skyblue';
       }; 
    },100);

事件冒泡和事件源对象

 //利用事件冒泡和事件源对象实现
   var ul = document.getElementsByTagName('ul')[0];
   ul.addEventListener('click',function (e){
     var event = e || window.event;
     var target = event.target || event.srcElement; 
    console.log(target.innerText);
   },false);