在开发中，我们经常会用到JavaScript中的一个关键字：this。在常见的编程语言中，几乎都有关键字this，但JavaScript中的this与普通编程语言中的this不一样。在常见的语言（java、c++等）中，this通常只出现在类的方法中，this指向它当前正在调用的对象，但是在JavaScript中，this更灵活，无论在哪里出现或它代表什么。这个问题在this的globaleffect下是很容易回答的。在浏览器中，this指向全局对象windowconsole.log(this)//窗口对象varname="hhf"console.log(this.name)//hhfconsole.log(window.name)//hhf但是，在发展，这很少在全球范围内直接使用。通常，它在函数中使用时指向什么？下面我们传递一段代码。在代码中，我们定义了一个函数，并以三种不同的方式调用它，这会产生不同的结果。functionfoo(){console.log(this)}foo()//窗口对象constobj={name:"hhf",foo:foo}obj.foo()//obj1constobj2={}foo.call(obj2)//Obj2从上面代码运行的结果，我们得到：1.函数正在调用，JavaScript会默认给this绑定一个值；2.this的绑定与定义的位置（写到哪里）无关；3、this的绑定与调用方法、调用位置有关；4.ThisisWhatisboundatruntime在JavaScript中，this有四种绑定规则，分别是：1.默认绑定2.隐式绑定3.显式绑定4.新建绑定我们分别来做这四种绑定默认绑定通常是绑定的时候一个独立的函数被调用。我们可以这样理解，一个独立的函数调用是不绑定调用对象的，默认绑定指向浏览器中。它是window，当它处于严格模式（usestrict）时，它指向undefined//Case1functionfoo(){console.log(this)}foo()//window对象//Case2functionfoo(fn){fn()}constobj={name:"hhf",bar:function(){console.log(this)}}foo(obj.bar)//窗口显示绑定显示绑定通常是一些对象对它调用，通俗地说：谁调用谁就指向谁functionfoo(){console.log(this.name);}constobj={name:"hhf",bar:foo}obj.bar()//hhf隐式绑定的另一种情况：当有多层对象嵌套调用一个函数时，比如object.object.function，this指向最后一层对象函数foo(){console.log(this.name);}constperson={name:"person"}person.foo=fooconstobj={name:"hhf",bar:foo,person:person}obj.person.foo()//Person在JavaScript中是显式绑定的，所有的函数都可以使用call、apply、bind来绑定函数的this。使用方法不同：call,apply在调用函数时调用，bind会返回一个新的函数来说明绑定的目的：防抖、节流等调用功能的使用call()方法使用指定的this值和单独给定的一个或多个参数来调用函数。它接收的参数是：首先是绑定的this，后面是要调用的函数的参数。具体使用方法如下//基本使用functionfoo(){console.log(this.name);}constobj={name:"hhf"}foo.call(obj)//hhf//传入参数函数foo(n,m){console.log(this.name);console.log(n,m)}constobj={name:"hhf"}foo.call(obj,"n","m")//hhfnmapply函数使用apply方法语法和功能类似于call()方法，唯一的区别是call()方法接受一个参数列表，而apply()方法接受一个包含多个参数的数组。具体用法如下functionfoo(n,m){console.log(this.name);console.log(n,m)}constobj={name:"hhf"}foo.call(obj,["n","m"])//hhf,n使用mbind函数bind函数接收相同参数为调用函数，但会返回一个新函数，新函数的this指向传入的对象functionfoo(n,m){console.log(this.name);console.log(n,m)}constobj={name:"hhf"}constnewFoo=foo.bind(obj,"n","m")newFoo()//hhfnmnewbindingnew是关键字JavaScript，new操作调用函数时，会执行以下操作1.函数内部会创建一个新的对象2.创建的对象的原型（__proto__）会指向函数的原型3.创建的对象会绑定到函数的this上4.如果函数没有其他返回值，默认返回对象functionPersion(){console.log(this)}newPersion();//persion{}rulepriority上面我们学习了四种绑定规则，那么我们可能会想，如果一个函数在调用时使用了多种绑定规则，那么哪一种的优先级最高呢？结果如下1.默认规则的优先级最低。毫无疑问，默认规则的优先级是最低的，因为当有其他规则时，这个会被其他规则约束。2.显示绑定优先级高于隐式绑定。绑定函数foo(){console.log(this.name)}constobj1={name:'obj1',foo:foo}constobj2={name:'obj2',}obj1.foo.call(obj2)//obj23.new绑定优先级高于隐式绑定functionfoo(){console.log(this)}constobj1={name:'obj1',foo:foo}constobj2={name:'obj2',}newobj1.foo()//foo{}4.新绑定的优先级高于绑定。newbinding、call和apply不允许同时使用，所以没有谁的优先级高。newbinding可以和bind一起使用，newbinding优先级更高(obj1)newnewFoo()//foo{}箭头函数的this箭头函数是ES6中一种新的函数写法，但是箭头函数没有绑定this，当this在箭头函数中使用时，会跟随its网上找作用域，使用最近的作用域this来使用//使用普通函数constobj1={name:'obj1',foo:function(){console.log(this)}}obj1.foo()//obj1//使用箭头函数constobj1={name:'obj1',foo:()=>{console.log(this)}}obj1.foo()//windowfoo的上层作用域由window//设置setTimeout如果传入的函数是普通函数，则绑定全局对象window，如果传入的是箭头函数，则其this执行是其上作用域的this指向constobj1={name:'obj1',bar:function(){setTimeout(()=>{console.log(this)})}}obj1.bar()//Obj1接下来我们传一道题，对刚学的内容做个小练习??varname="window"functionPerson(name){this.name=namethis.obj={name:"obj",foo1:function(){returnfunction(){console.log(this.name)}},foo2:function(){return()=>{console.log(this.name)}}}}varperson1=newPerson("person1")varperson2=newPerson("person2")person1.obj.foo1()()person1.obj.foo1.call(person2)()person1.obj.foo1().call(person2)person1.obj.foo2()()person1.obj.foo2.call(person2)()person1。obj.foo2().call(person2)的输出为/*windowwindowperson2objperson2obj*/springboot实战电商项目mall4j(https://gitee.com/gz-yami/mall4j)java商城系统源码
