this的使用(js的问题)

简介: this的使用(js的问题)

this指向

指代当前调用的这个对象

4中绑定(优先级从低到高):

  • 默认绑定
  • 隐式绑定
  • 显示绑定
  • new绑定
var person = {
  name: 'Tom',
  age: 23,
  showName: function () {
    // this->person
    console.log(this.name); // Tom
  },
  showAge: function () {
    // 局部函数
    function _age(){
      // this->window
      console.log(this.age); // undefined
    }
    _age();
    // this->person
    console.log(this.age); // 23
  },
};
 
person.showName()
person.showAge()

可以先保存this

let that = this;

改变this指向

call/apply/bind

var name = 'Tom'
 
var person = {
  name: 'Jack',
  showName: function(){
    console.log(this.name);
  }
}
 
 
person.showName(); // Jack
 
// this->window
var show = person.showName;
show(); // Tom
 
var fn = person.showName.bind(person);
fn(); // Jack

实现一个bind方法

Function.prototype.bind = function(obj){
  var that = this;
  return function(){
    that.apply(obj)
  }
}
 
 
// 验证
var name = 'Tom'
 
var person = {
  name: 'Jack',
  showName: function(){
    console.log(this.name);
  }
}
 
var fn = person.showName.bind(person);
fn(); // Jack1. Function.prototype
相关文章
|
18天前
|
JavaScript 前端开发 Java
js常用技巧汇总
js常用技巧汇总
|
18天前
|
JavaScript
什么是js?js的特点是什么?
什么是js?js的特点是什么?
|
18天前
|
存储 JavaScript 前端开发
js的一些小技巧
js的一些小技巧
|
10月前
|
JavaScript
js实现全选反选
js实现全选反选
|
10月前
|
JavaScript
JS 解决 removeEventListener 不生效问题
JS 解决 removeEventListener 不生效问题
310 0
|
JavaScript 前端开发
3、JS总结
3、JS总结
53 0
3、JS总结
|
JavaScript 前端开发
sdmenu js
引用:http://hi.baidu.com/coolcat_police/blog/item/8762694446a8ed87b3b7dc06.html 其它博文:http://hi.baidu.com/coolcat_police/blog/category/Jquery     上网下载sdmenu的javascript。
894 0
ActionTileViewController.js
Created by Wang, Jerry, last modified on Oct 19, 2015
ActionTileViewController.js
|
JavaScript 前端开发
|
前端开发 JavaScript 人工智能

热门文章

最新文章