javascript常用知识点集

目录结构

一、jquery源码中常见知识点

二、Javascript中原型链常见的知识点

三、常用的方法集知识点

四、经典实例应用

一、jquery源码中常见的知识点

　　1.string，number类型转换的快捷方法

// @param s为字符串，n为数字function fn(obj){        //转换为String类型    var s = obj +"";        //转换为number类型    var n = +obj;}

　　分享一个面试例子：

//加会将其后面自动转换成字符串"64"+4="644"//减会将其自动转换成数字"64"-4=60

　　2.bool类型转换

　　!!obj，将其强制转换为bool类型

alert(!!0)  //结果为falsealert(!!"33dd")  //结果为true

　　!obj，取相反的bool类型

alert(!0)  //结果为truealert(!"222333")  //结果为false

　　3.=== 与 ==区别

　　=== 是严格相等，不会进行类型转换，而 == 是不严格相等，会进行类型转换。有些js的书中，建议开发人员永远不要用 == 或者 != 。

　　但是jquery源码中，有用到“==”或者“!=”的情况 —— 判断 undefined 和 null 的时候(undefined == null为true)。

//这里的判断，将obj是null，obj是undefined都排除在外了if(obj != null){}

　　4.检测obj是否为window对象

//null == window.null为truefunction isWindow(obj){    return obj != null && obj == window.obj;}

　　5.|| 与 && 用法技巧

//例 var aa=5; name = aa || {} ; alert(name) 则name为55this.name = name || {} //如果name值存在，则值为name，反之为{}//例 var aa=5; name = aa && {} ; alert(name) 则name为{}，因为aa为5，不为0则为真this.name = bool && [] //如果bool为true，则值为[],反之则为bool

　　经典实例:

( window.foo || ( window.foo = "bar" ) );                 alert(window.foo);  //弹出  bar// 为什么最后的结果是bar呢，其实可以看成是 undefined || bar出来的结果肯定是bar

　　6.setTimeout(fn,0)与setTimeout(fn)区别（此处有问题，没有考虑单线程的问题，请比较了解的大神，帮忙指点）

　　setTimeout(fn,0)与setTimeout(fn)都是延迟执行，但是setTimeout(fn)比setTimeout(fn,0)延迟时间还要长，例

        function fn(){            var data = new Date();            for(var i=0;i<=1000;i++){                if(i==1000){                    console.log("fn="+data.getTime());                }            }        }        function fn1(){            var data = new Date();            for(var i=0;i<=1000;i++){                if(i==1000){                    console.log("fn1="+data.getTime());                }            }        }        setTimeout(fn,0),        setTimeout(fn1);

　　结果：

　　7.判断是否为数值

function isNumeric(obj){return !isNaN(parseFloat(obj)) && isFinite(obj);}

　　8.判断是否为空对象

function isEmptyObject(){    var name;        //遍历不是空对象返回    for (name in obj) {        return false;    }    return true;}

　　9.检测对象类型

　　检测obj对象类型，返回类型,通过Object.PRototype.toString()来判断类型，但是ie低版本兼容性有问题，因此采用{}.toString来监测，返回为[object Array],[object Object],[object Function]

// 类型判断function isType(type){    return function(o){        return Object.prototype.toString.call(o) === '[object ' + type + ']';    }}var isString = isType(“String”);var isObject = isType("Object");var isArray = isType("Array"); isString("I'm Barret Lee.");isArray([1,2,3])；isObject({});

　　10.jquery里的去除空格trim妙用

//相当于if (String.prototype.trim && “/uFEFF/xA0″.trim() !== “”)高级的浏览器已经支持原生的String的trim方法，但是pFan还为了避免它没法解析全角空白，所以加多了一个判断：”/uFEFF/xA0″.trim() !== “”    vart core_version = "1.0",core_trim = core_version.trim;            function trim(){    core_trim && !core_trim.call("/uFEFF/xA0") ?                    function (text) {                        return text == null ?                            "" :                            core_trim.call(text); //这里按我的理解应该为" ".trim.call(text),有点不明白转换为"1.1.0".trim.call(text)                    } :                             // 高级的浏览器已经支持原生的String的trim方法，如果浏览器不支持则采用                    function (text) {                        var  whitespace = "[//x20//t//r//n//f]",                         rtrim = new RegExp("^" + whitespace + "+|((?:^|[^////])(?:////.)*)" + whitespace + "+$", "g");                        return text == null ?                            "" :                            (text + "").replace(rtrim, "");                    },                //nodeName函数是获取dom节点的节点名字或者判断其名字跟传入参数是否匹配                    nodeName: function(elem,name){                     //IE下，DOM节点的nodeName是大写的，例如DIV                     return elem.nodeName && elem.nodeName.toLowerCase() === name.toLowerCase();                }}

　　11.jquery中检测数组或者类数组中是否含存在传入的值

/**    检查数组中是否存在传入的值，如果存在就返回值所在的位置，如果不存在就返回-1。    *elem 规定需检索的值。    *arr 数组    *i 可选的整数参数。规定在数组中开始检索的位置。它的合法取值是 0 到 arr.length - 1。如省略该参数，则将从数组首元素开始检索。    */function inArray(elem, arr, i){    var len;    if (arr) {                //如果浏览器支持Array拥有indexOf方法        if ([].indexOf) {            return [].indexOf.call(arr, elem, i);        }        len = arr.length;         //当i为负数的时候，从数组后边len+i的位置开始索引         //理解这个分成两个部分i = i ? (i < 0 ? Math.max(0, len + i) : i) : 0;，i=i为true，执行(i < 0 ? Math.max(0, len + i) : i)，反正执行i=0        i = i ? i < 0 ? Math.max(0, len + i) : i : 0;        for (; i < len; i++) {            // 双重检测防止类似这样的数组 ar = [];ar[1]=1;ar[0] = undefined; 0 in ar =false;a[0]===undefined;             // 0 in arr  => arr[0]是否存在  'nme' in arr => arr['nme']是否存在            if (i in arr && arr[i] === elem) {                return i;            }        }    }    return -1;}

二、javascript中原型链常见的知识点

　　1.hasOwnProperty()方法

　　使用hasOwnProperty()方法可以检测一个属性是存在与实例，还是存在于原型中。这个方法从Object继承，只在给定属性存在于对象实例中时，才会返回true。

    function Person(){            this.age=25;            this.job="web";    }    Person.prototype={        name:'pingfan',        sayName:function(){                        alert(this.name);                }    }    var person1=new Person();        //来自构造函数，检测属性，也返回true    alert(person1.hasOwnProperty("age"));        //来自原型属性，返回false    alert(person1.hasOwnProperty("name"));        person1.name='ping';    //来自实例属性，返回true    alert(person1.hasOwnProperty("name"));

　　2.通过instanceOf检查this是否为构造函数的一个实例

 function shiCha(opt){    //检测this是否为对象的实例    if( !(this instanceof shiCha)){        return new shiCha(opt);    }                }var shicha1 = new shiCha(), //会返回一个shiCha对象　　 shicha2 = shiCha(); //构造函数作为函数时与其他函数无意，this指向window

　　3.javascript中Array.prototype.slice.call(arguments)　　

　　我们通常看到Array.prototype.slice.call(arguments,1)或者Array.prototype.slice.call(arguments)，都有点摸不着头脑，其实我们就是借助Array.prototype中slice()将arguments变成一个数组，并且使用该数组工作更方便，第二个参数是从索引值，开始将其变成数组，例Array.prototype.call("22223",2)和Array.prototype.call([1,2,3,4],2)，从字符串第二个开始。

function sliArray(array){                        //输出为从索引1到索引3            return Array.prototype.slice.call(array,1,3);}alert(sliArray([1,2,3,4,5,6]))    //结果为2,3

　　4.利用闭包，实现单例模式，保证构造函数只实例一次

//对象之间永远不会完全相等，除非它们是同一对象，因此即使创建一个具有完全相同成员的同类对象，它也不会与第一个对象完全相同          　　　　  var Universe;            (function(){                var instance;                Universe = function Universe(){                    if(instance){                        return instance;                    }                    instance = this;                                        //所有功能                    this.start_time = 0;                    this.bang = "Big";                }            })()            var person1 = new Universe(),                person2 = new Universe();                alert(person1 === person2 );  //返回true

　　5.利用空对象F，实现对象继承，效率最高

//利用空对象做媒介，进行继承效果最佳function inhert(C,P){        var F=function(){};        F.protototype = P.prototype;        C.prototype = new F();        C.prototype.constructor = C;}

　　6. 构造函数设置return obj对象，会导致对象与原型链断掉

　　理解这个问题，先理解一个概念，通常我们用new Object()，其实可以理解为隐式的做了三件事情：

　　　　①.创建一个空对象，var this ={}，继承object对象的一些原有的属性；　　　　②.将构造函数写的属性挂载到创建的对象，this.name = "pfan";　　　　③.通过new object()，返回this对象　　 场景一

        var Parent = function (){            var that = {};            that.name = "pfan";             that.age = "25";            return that;        }                Parent.pr