原生js中的經常使用方法的寫法

一、js深度克隆的方法javascript

    //第一種
        function deepClone(obj){
            var str,newObj = obj instanceof Array? [] : {};
            if(typeof obj !== 'object'){
                return;
            }else if(window.json){
                str = JSON.stringify(obj);
                newObj = JSON.parse(str);
            }else{
                for(var i in obj){
                    newObj[i]=typeof obj[i]==='object'?deepClone(obj[i]):obj[i]
                }
            }
            return newObj;
        }
        //第二種
        function deepClone(obj,newObj){
            var newObj = newObj || {};
            for(key in obj){
                if(typeof obj[key] == 'object'){
                    newObj[key] = (obj[key].constructor === Array)?[]:{}
                    deepClone(obj[key],newObj[key]);
                }else{
                    newObj[key] = obj[key]
                }
            }
            return newObj;
        }    

二、js數組去重的方法java

    //第一種
        function unique(ary){
            var obj={};
            for(var i=0;i<ary.length;i++){
                var cur = ary[i];
                if(obj[cur] == cur){
                    ary[i] = ary[ary.length-1];
                    ary.length--;
                    i--;
                }
                obj[cur] = cur;
            }
            return ary;
        }
        console.log(unique([2,3,2,4,3,5,6,1,1]));
        //第二種
        function unique(ary){
            var arr1 = [];
            var obj = {};
            for(var i=0;i<ary.length;i++){
                if(!obj[ary[i]]){
                    arr1.push(ary[i]);
                    obj[ary[i]] = 1;

                }
            }
            return arr1;
        };
        var arr = [3,1,1,2,2,3,3,4,4];
        console.log(unique(arr));

三、js判斷對象是否是數組json

方法一: instanceof

      instanceof 用於判斷一個變量是否某個對象的實例,左邊操做數是一個對象,右邊操做數是一個函數對象或者函數構造器。原理是經過判斷左操做數的對象的原型鏈上是否具備右操做數的構造函數的prototype屬性。
a instanceof b?alert("true"):alert("false")  //注意b值是你想要判斷的那種數據類型,不是一個字符串,好比Array。
舉一個例子:
[javascript] view plain copy
var arr=[];  
console.log(arr instanceof Array) //返回true   
方法二之 constructor

     在W3C定義中的定義:constructor 屬性返回對建立此對象的數組函數的引用,就是返回對象相對應的構造函數。從定義上來講跟instanceof不太一致,但效果都是同樣的。

那麼判斷各類類型的方法:
[javascript] view plain copy
console.log([].constructor == Array);  
console.log({}.constructor == Object);  
console.log("string".constructor == String);  
console.log((123).constructor == Number);  
console.log(true.constructor == Boolean);  
注意:
      使用instaceof和construcor,被判斷的array必須是在當前頁面聲明的!好比,一個頁面(父頁面)有一個框架,框架中引用了一個頁面(子頁面),在子頁面中聲明瞭一個array,並將其賦值給父頁面的一個變量,這時判斷該變量,Array ==object.constructor;會返回false;
緣由:
1、array屬於引用型數據,在傳遞過程當中,僅僅是引用地址的傳遞。
2、每一個頁面的Array原生對象所引用的地址是不同的,在子頁面聲明的array,所對應的構造函數,是子頁面的Array對象;父頁面來進行判斷,使用的Array並不等於子頁面的Array。
第三種:判斷對象原型類型
function isAry(obj){
        return Object.prototype.toString.call(obj) === "[object Array]"
    }

四、自定義Object.create()——手寫數組

Object.create=function(father,props){
      console.log("個人create");
      /*使用setPrototypeOf方法
      var o=Object();//1. 建立空對象
      Object.setPrototypeOf(o,father);//2. 繼承father
      */
      /*不使用setPrototypeOf方法
      function Constructor(){}
      Constructor.prototype=father;
      var o=new Constructor();
      */
      Object.defineProperties(o,props);//3. 定義新屬性
      return o;
  }

五、js判斷是不是迴文的方法數據結構

    function isPalindrome(str){
        str +="";
        for(var i=0,j=str.length-1;i<j;i++,j--){
            if(str.charAt(i) !== str.charAt(j)){
                return false;
            }
        }
        return true;
    }
    console.log(isPalindrome('上海自來水來自海上'));

 六、js類數組(arguments,dom元素集合)轉化爲數組框架

let arrayLike = {
    '0' : 'a',
    '1' : 'b',
    '2' : 'c',
    length : 3
};
1、Array.prototype.slice.call()
利用數組slice的方法實現
let arr1 = Array.prototype.slice.call(arrayLike);
2、[].slice.call();
let arr2 = [].slice.call(arrayLike);
3、Array.from()
ES6新增的轉換數組的方法
let arr3 = Array.from(arrayLike);
4、擴展運算符(…)
ES6中新增的方法,擴展運算符(…)也能夠將某些數據結構轉爲數組
let arr4 = [...arrayLike]
相關文章
相關標籤/搜索