JavaScript函数及作用域的小结(3)


var obj = {
  data:null,
  getData:function(){
          $.post(url,{param:token},function(dataBack){ //jQuery ajax post method
                this.data = dataBack; //试图将服务器返回的数据赋给 obj.data ,但这里的 this 已经指向 jQuery 的 ajax 对象了
          },'json'); 
  }
}

//正确做法
var obj = {
  data:null,
  getData:function(){
          var host = this; //保存 obj 对象的引用
          $.post(url,{param:"token"},function(dataBack){
                host.data = dataBack;
          },'json'); 
  }
}


3、apply方法调用:

apply方法与call方法唯一不同的地方是函数传参方式不同。

obj2.fun2.call(obj,1,2);  改为 apply方式就是obj2.fun2.apply(obj,[1,2]);

apply使用类数组方式传参,除数组外,还可以使用arguments、HTMLCollection来传参,但arguments并非数组,如:

var obj={};

function fun_1(x,y){

function fun_2(a,b){

return a+b;

}

fun_2.apply(obj,arguments);  //用fun_1的arguments对象来传参,实际上是接收了x,y

}apply 传参在IE8 及IE8一下的浏览器中哟2个问题

在 call 和 apply 调用中,如果传入标量数据(true/false ,string,number),函数运行时将把他们传入的基本数据包装成对象,然后把this指向包装后的对象,试试下面的代码。
function a(){

alert(typeof this);

alert(this.constructor);

alert(this);

}

a.call(false);

a.call(100);

a.call('hello');

甚至可以用这个特点来传参数,但是不建议这种用法:

function a(){  alert(1+this); } //对象在运算中自动进行类型转换

a.call(100); //101

4、函数作为对象构造器(构造函数)

当函数使用 new 运算作为对象构造器运行时,this 指向新构造出对象,如果该构造函数的返回值不是 null 以外的对象,构造函数运行完毕将返回 this 指向的对象,否则返回原定义的对象。

代码如下:


function Fun(){

this.a = 1;

this.b = 3;

console.log(this); //{a:1,b:2}

// return {a:999};  //加上此举 ,将返回 {a:999}

}

var obj = new Fun();  //obj = {a:1,b:2} ,如果没有参数,也可以写成 var obj = new Fun;


五、函数作用域

js的变量作用域是函数级的,在js里没有类似C语言的块级作用域。

js编程环境的顶级作用域是window对象下的范围,称为全局作用域,全局作用域中的变量称为全局变量。

js函数内的变量无法在函数外面访问,在函数内却可以访问函数外的变量,函数内的变量称为局部变量。

js函数可以嵌套,多个函数的层层嵌套构成了多个作用域的层层嵌套,这称为js的作用域链。

js作用域链的变量访问规则是:如果当前作用域内存在要访问的变量,则使用当前作用域的变量,否则到上一层作用域内寻找,直到全局作用域,如果找不到,则该变量为未声明。

注意,变量的声明在代码解析期完成,如果当前作用域的变量的声明和赋值语句写在变量访问语句后面,js函数会认为当前作用域已经存在要访问的变量不再向上级作用域查找,但是,由于变量的赋值发生的代码运行期,访问的到变量将是undefined。

代码如下:


var c=1000;

function out(){

var a=1;

var b=2;

function fun(){

alert(a); //undefined

var a=10;

alert(a); //10

alert(b); //2

alert(c); //1000

}

fun();

}

out();

六、匿名函数的调用

匿名函数的使用在js很重要,由于js中一切数据都是对象,包括函数,因此经常使用函数作为另一个函数的参数或返回值。

如果匿名函数没有被保存,则运行后即被从内存中释放。

匿名函数的调用方式一般是直接把匿名函数放在括号内替代函数名。如:

(function(a,b){ return a+b;})(1,2); //声明并执行匿名函数,运行时传入两个参数:1和2

//或者

(function(a,b){ return a+b;}(1,2));

//下面这种写法是错误的:

function(a,b){ return a+b;}(1,2); 

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/ac1c531387274afa27ca18113ddd6789.html