美文网首页
前端基础(问答24)

前端基础(问答24)

作者: 郑哲明 | 来源:发表于2016-09-02 09:24 被阅读33次

keywords: this、闭包、apply、call。


  • apply、call 有什么作用,什么区别

apply、call用于修改函数的运行上下文,即this。

区别:apply传入的两个参数,第二个以数组形式传入;call传入多个参数,第一个为传入的this,后面的是传入函数的参数。

举例:

Array.prototype.slice.call(this,arg1,arg2,arg3...)

Array.prototype.slice.apply(this,[arg1,arg2,arg3,...])

如果传入的this为null,则this指向window。

代码

  • 以下代码输出什么?

var john = { 
  firstName: "John" 
}
function func() { 
  alert(this.firstName + ": hi!")
}
john.sayHi = func
john.sayHi() 

// John: hi!
  • 下面代码输出什么,为什么

func() 

function func() { 
  alert(this)
}

//window    func在win中调用,this指向window
  • 下面代码输出什么

function fn0(){
    function fn(){
        console.log(this);
    }
    fn();
}

fn0();


document.addEventListener('click', function(e){
    console.log(this);
    setTimeout(function(){
        console.log(this);
    }, 200);
}, false);


//window
//点击document后
//document
//window
  • 下面代码输出什么,why


var john = { 
  firstName: "John" 
}

function func() { 
  alert( this.firstName )
}
func.call(john) 

//john  func函数内的this修改为john
  • 代码输出?

var john = { 
  firstName: "John",
  surname: "Smith"
}

function func(a, b) { 
  alert( this[a] + ' ' + this[b] )
}
func.call(john, 'firstName', 'surname') 


//John Smith 
  • 以下代码有什么问题,如何修改

var module= {
  bind: function(){
    $btn.on('click', function(){
      console.log(this) //this指什么
      this.showMsg();
    })
  },
  
  showMsg: function(){
    console.log('饥人谷');
  }
}

//this.showMsg这里的this指向的是$btn,无法调用showMsg

//修改:
//function(){
//    var that  = this
//    $btn.on('click', function(){
//      console.log(this) 
//      that.showMsg();
//    })
//  }


相关文章

  • 前端基础(问答24)

    keywords: this、闭包、apply、call。 apply、call 有什么作用,什么区别 apply...

  • 前端基础(问答4)

    keywords:三种列表,语义化,class与id,行内元素(inline elements),块级元素(blo...

  • 前端基础(问答5)

    keywords:选择器、优先级、class与id、命名空间、伪类。 CSS选择器常见的有几种? 常见的CSS选择...

  • 前端基础(问答7)

    keywords: 定位、浮动、布局、文档流、负margin。 文档流的概念指什么?有哪种方式可以让元素脱离文档流...

  • 前端基础(问答11)

    keywords: 白屏、FOUC、asyns、defer、渲染机制、JavaScript数据类型、。 CSS和J...

  • 前端基础(问答19)

    keywords: Ajax。 Ajax是什么?有什么用? Ajax = Asynchronous JavaScr...

  • 前端基础(问答12)

    keywords:函数声明、函数表达式、声明前置、argument、重载、作用域链 函数声明和函数表达式有什么区别...

  • 前端基础(问答13)

    keywords: 数组读写、字符串转化数组、数组转字符串、函数、数学函数、随机数、ES5数组、排序。 数组方法里...

  • 前端基础(问答14)

    keywords: 数组读写、字符串转化数组、数组转字符串、函数、数学函数、随机数、ES5数组、排序。 问题 基础...

  • 前端基础(问答9)

    keywords: 负边距、relative、三栏布局、圣杯布局、双飞翼布局。 负边距在让元素产生偏移时和posi...

网友评论

      本文标题:前端基础(问答24)

      本文链接:https://www.haomeiwen.com/subject/utbcettx.html