javascript高级知识点总结

函数内this作用

function math(){  var info = 'info';        //外部无法直接获取，成了私有属性  this.name = 'fun1';       //用this来赋值，则外部就可以根据对象.属性来获取这个值，成了public属性  this.add = function(a,b){    return a+b;  }}var m = new math();//注意需要用new来创建对象console.log(m.info)//获取不到console.log(m.name)//输出fun1console.log(m.add(1,2))//输出3

立即执行函数

(function(形参){  //会立即执行的代码块}(实参))

​ 顾名思义，立即执行函数在创建函数的同时会立即执行，没有绑定任何事件，也无法被调用，也无需等待任何一部操作，在被加载时就立即执行。function(){}是一个匿名函数，紧跟其后的()表示调用了该函数，并传入参数。

实例：

//修改微信内置对象实现微信分享(function(cache_data){  window.wxData = {    img_url : 'http://xxx.xx.jpg',    link : location.href,    title : "标题",    desc : "描述"  };}(window.cache_data));

闭包

​ 闭包的思想就是外部无法直接访问某个方法（类）中的私有变量，只能通过该方法的内部方法来访问和操作该方法的私有变量。

实例：

$(function(){  var result = outter();//result等于outter的执行结果，也就是result指向Inner函数  result();//实质上为调用Inner函数  result();//多次调用Inner()时，函数内部访问的同一个a对象，因此输出结果是：1、2、3  result();  console.log('------直接访问outter私有变量------');  console.log(outter.a);//直接访问是无法访问到的，此时a就成了outter真正的内部变量  var product = new Product();  product.setName("商品1");  product.setPrice(9.99);  console.log(product.getName()+"  ---  "+product.getPrice());});function outter(){  var a = 0;  function inner(){    a += 1;    console.log(a);  }  return inner;}//闭包的另一种形式，也就是通常的bean对象形式//外部无法直接访问Product的私有变量，只能通过Setter和getter来操作，Product内部函数访问的是同一个私有变量function Product(){  var name;  var price;  this.setName = function(val){    name = val;  }  this.getName = function(){    return name;  }  this.setPrice = function(val){    price = val;  }  this.getPrice = function(){    return price;  }}

​ 另一种复杂一点的情况，也是面试常问的，这种问题最主要的明白，只有对象名后面跟上()才会真正调用对象指向的函数

function createFunctions(){    var result = new Array();    for (var i=0; i < 10; i++){      result[i] = function(){//result[i]都指向一个function，因为该function还没有被调用，所以function内部都返回同一个对象i        return i;      };    }    return result;}var funcs = createFunctions();//此时//result[0] = function(){return i}//result[1] = function(){return i}//result[2] = function(){return i}//....而i在createFunctions内部循环结束后i等于10for (var i=0; i < funcs.length; i++){  console.log(funcs[i]());//此时才是真正调用内部函数}

prototype

​ 每个函数（类）都有prototype属性，可以用来动态为该函数添加方法。

$(function(){  //为Product函数绑定toString方法  Product.prototype.toString = function(){    return {      name:this._name,      price:this._price,      info:'prototype就是为函数（类）绑定方法'    }  }  var p1 = new Product('商品1',8.88);  var p2 = new Product('商品2',9.99);  console.log(p1.toString());//调用toString()  console.log(p2.toString());});function Product(name,price){  this._name = name;  this._price = price;}

模块化

​ 提现和封装思想。基于立即执行函数来实现，可以控制模块内部变量和方法的访问权限，大部分框架入jQuery都使用的大量的模块化语句。

var module = (function(形参) {    //内部变量和方法    //以return一个对象的形式来暴露方法或属性，以供外部调用    return{    }})(实参);

​ 模块内部的方法不会立即执行，只有外部调用时才会执行，形参实参可以为空。

实例：

$(function() {  //调用模块提供的属性或方法  console.log(module.description);  module.introduce('blysin');  module.printParam();});//创建一个模块化代码var module = (function(param) {  var name = "module"; //private属性  function print(val) { //private方法    console.log('调用了print方法，输出：' + val);  }  function introduce(user) { //private方法    var words = user + 'is useing ' + name;    print(words);  }  function printParam(){    console.log(param);  }  //return的作用就是将私有的方法或属性暴露给外部，供外部调用  return {    description: "This is a simple "+name, //暴露一个属性    introduce: introduce,//暴露一个方法    printParam:printParam  }})({  status:'正常',  isDebug:true});

apply, call与bind方法（已对象（json）为基础）

JavaScript开发者有必要理解apply、call与bind方法的不同点。它们的共同点是第一个参数都是this，即函数运行时依赖的上下文。

三者之中，call方法是最简单的，它等价于指定this值调用函数：

obj1.method.call(obj2,arg1,arg2...);

​ 执行效果：让obje2对象执行obj1对象内的某个方法，arg为该方法的参数。

var user = {    name: "Rahul Mhatre",    whatIsYourName: function() {        console.log(this.name);    }};user.whatIsYourName(); // 输出"Rahul Mhatre",var user2 = {    name: "Neha Sampat"};user.whatIsYourName.call(user2); // 输出"Neha Sampat"

apply方法与call方法类似。两者唯一的不同点在于，apply方法使用数组指定参数，而call方法每个参数单独需要指定：

• apply(thisArg, [argsArray])
• call(thisArg, arg1, arg2, …)

var user = {    greet: "Hello!",    greetUser: function(userName) {        console.log(this.greet + " " + userName);    }};var greet1 = {    greet: "Hola"};user.greetUser.call(greet1, "Rahul"); // 输出"Hola Rahul"user.greetUser.apply(greet1, ["Rahul"]); // 输出"Hola Rahul"

使用bind方法，可以为函数绑定this值，然后作为一个新的函数返回：

var user = {     greet: "Hello!",     greetUser: function(userName) {     console.log(this.greet + " " + userName);     }};var greetHola = user.greetUser.bind({greet: "Hola"});var greetBonjour = user.greetUser.bind({greet: "Bonjour"});greetHola("Rahul") // 输出"Hola Rahul"greetBonjour("Rahul") // 输出"Bonjour Rahul"