this 的绑定形式
在 JavaScript 中,this 的指向有 4 种绑定形式
默认绑定(指向 window)
1
2
3
4function books() {
consloe.log(this)
}
books() // window直接调用函数,this 指向 window
隐式绑定
1
2
3
4
5
6
7
8
9
10
11
12
13
14var books = {
book1: 'javaScript高级程序设计',
book2: 'javaScript设计模式',
book3: '你不知道的CSS',
allBooks: function() {
consloe.log("第一本书:" + this.book1)
consloe.log("第二本书:" + this.book2)
consloe.log("第三本书:" + this.book3)
}
}
books.allBooks()
// 第一本书:javaScript高级程序设计
// 第二本书:javaScript设计模式
// 第三本书:你不知道的CSS隐式绑定,this 指向调用者对象
硬绑定
通过
call
,apply
来改变this
的指向1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16var books = {
name: 'javaScript高级程序设计',
printBook: function() {
console.log('书名:' + this.name);
}
}
var book1 = {
name: 'javaScript设计模式'
}
var book2 = {
name: '你不知道的CSS'
}
books.printBook.call(book1) // javaScript设计模式
books.printBook.call(book2) // 你不知道的CSS
books.printBook.apply(book1) // javaScript设计模式
books.printBook.apply(book2) // 你不知道的CSS构造函数绑定
1
2
3
4
5
6
7
8
9function Book(name) {
this.name = name;
this.printBook = function() {
console.log("这本书是:" + this.name)
}
}
var name = 'javaScript设计模式';
var book1 = new Book('你不知道的CSS')
book1.printBook() // 你不知道的CSS
本博客所有文章除特别声明外,均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来自 解忧杂货店小店员!