开启掘金成长之旅!这是我参与「掘金日新计划 · 12 月更文挑战」的第16天,点击查看活动详情
16、this
this
- 函数在执行时,JS解析器每次都会传递进一个隐含的参数
- 这个参数就叫做 this
- this会指向一个对象
- this所指向的对象会根据函数调用方式的不同而不同 1.以函数形式调用时,this指向的是window 2.以方法的形式调用时,this指向的是调用方法的对象 ...
- 通过this可以在方法中引用调用方法的对象
<script>
function fn() {
// console.log(this === window)
console.log("fn打印", this)
}
const obj = { name: "孙悟空" }
obj.test = fn
const obj2 = { name: "猪八戒", test: fn }
// fn()
// window.fn()
// obj.test() // {name:"孙悟空"}
// obj2.test() // {name:"猪八戒", test:fn}
const obj3 = {
name: "沙和尚",
sayHello: function () {
console.log(this.name)
},
}
const obj4 = {
name: "唐僧",
sayHello: function(){
console.log(this.name)
}
}
// 为两个对象添加一个方法,可以打印自己的名字
obj3.sayHello()
obj4.sayHello()
</script>
17、箭头函数的this
箭头函数:
([参数]) => 返回值
例子:
无参箭头函数:() => 返回值
一个参数的:a => 返回值
多个参数的:(a, b) => 返回值
只有一个语句的函数:() => 返回值
只返回一个对象的函数:() => ({...})
有多行语句的函数:() => {
....
return 返回值
}
箭头函数没有自己的this,它的this有外层作用域决定
箭头函数的this和它的调用方式无关
<script>
function fn() {
// console.log(this === window)
console.log("fn打印", this)
}
const obj = { name: "孙悟空" }
obj.test = fn
const obj2 = { name: "猪八戒", test: fn }
const obj3 = {
name: "沙和尚",
sayHello: function () {
console.log(this.name)
},
}
const obj4 = {
name: "唐僧",
sayHello: function(){
console.log(this.name)
}
}
// 为两个对象添加一个方法,可以打印自己的名字
obj3.sayHello()
obj4.sayHello()
</script>
18、严格模式
JS运行代码的模式有两种:
正常模式
- 默认情况下代码都运行在正常模式中, 在正常模式,语法检查并不严格 它的原则是:能不报错的地方尽量不报错
- 这种处理方式导致代码的运行性能较差
严格模式
-
在严格模式下,语法检查变得严格 --------> "use strict"
- 禁止一些语法
- 更容易报错
- 提升了性能
-
在开发中,应该尽量使用严格模式, 这样可以将一些隐藏的问题消灭在萌芽阶段, 同时也能提升代码的运行性能
<script>
"use strict" // 全局的严格模式
let a = 10
// console.log(a)
function fn(){
"use strict" // 函数的严格的模式
}
</script>