{"action":"created","issue":{"url":"https://api.github.com/repos/MrErHu/blog/issues/10","repository_url":"https://api.github.com/repos/MrErHu/blog","labels_url":"https://api.github.com/repos/MrErHu/blog/issues/10/labels{/name}","comments_url":"https://api.github.com/repos/MrErHu/blog/issues/10/comments","events_url":"https://api.github.com/repos/MrErHu/blog/issues/10/events","html_url":"https://github.com/MrErHu/blog/issues/10","id":235754467,"number":10,"title":"一个小小的JavaScript题目","user":{"login":"MrErHu","id":16449143,"avatar_url":"https://avatars3.githubusercontent.com/u/16449143?v=4","gravatar_id":"","url":"https://api.github.com/users/MrErHu","html_url":"https://github.com/MrErHu","followers_url":"https://api.github.com/users/MrErHu/followers","following_url":"https://api.github.com/users/MrErHu/following{/other_user}","gists_url":"https://api.github.com/users/MrErHu/gists{/gist_id}","starred_url":"https://api.github.com/users/MrErHu/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/MrErHu/subscriptions","organizations_url":"https://api.github.com/users/MrErHu/orgs","repos_url":"https://api.github.com/users/MrErHu/repos","events_url":"https://api.github.com/users/MrErHu/events{/privacy}","received_events_url":"https://api.github.com/users/MrErHu/received_events","type":"User","site_admin":false},"labels":[{"id":626262402,"url":"https://api.github.com/repos/MrErHu/blog/labels/JavaScript","name":"JavaScript","color":"f5da55","default":false},{"id":626263121,"url":"https://api.github.com/repos/MrErHu/blog/labels/%E4%BB%8E%E9%9D%A2%E8%AF%95%E9%A2%98%E4%B8%AD%E6%88%91%E4%BB%AC%E8%83%BD%E5%AD%A6%E5%88%B0%E4%BB%80%E4%B9%88","name":"从面试题中我们能学到什么","color":"c5def5","default":false}],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":1,"created_at":"2017-06-14T03:43:42Z","updated_at":"2017-11-01T02:01:24Z","closed_at":null,"author_association":"OWNER","body":"　　今天前Leader在下班前发给我一道JavaScript的题目，看到感觉很不错，而且我开始的时候确实也理解错了，觉得有必要拿出来讲讲，并且为此我也坐错了地铁，哈哈哈~\r\n　　题目是这样的：\r\n```javascript\r\nvar length = 10;\r\nfunction fn() {\r\n    console.log(this.length)\r\n};\r\nvar obj = {\r\n    length: 5, \r\n    method: function (fn) {\r\n        fn();\r\n        arguments[0]();\r\n        fn.call(obj, 12);\r\n    }\r\n};\r\nobj.method(fn, 1);\r\n```\r\n　　请问输出是什么，当时那手机看的时候给出了答案\r\n\r\n<!--more-->\r\n\r\n```\r\n10 10 5\r\n```\r\n　　实际上并不是如此，答案是：\r\n```\r\n10 2 5\r\n```\r\n　　仔细分析了一下才知道原因，首先介绍一下四种this的类型：\r\n1. **默认绑定** \r\n2. **隐式绑定**\r\n3. **显示绑定**\r\n4. **new绑定**\r\n\r\n其中，**默认绑定**就是什么都匹配不到的情况下，非严格模式`this`绑定到全局对象`window`或者`global`,严格模式绑定到`undefined`;**隐式绑定**就是函数作为对象的属性，通过对象属性的方式调用，这个时候`this`绑定到对象;**显示绑定**就是通过`apply`和`call`调用的方式;**new绑定**就是通过`new`操作符时将`this`绑定到当前新创建的对象中，它们的匹配有限是是从小到大的。\r\n　　那么现在来解释一下：\r\n```javascript\r\nobj.method(fn, 1);\r\n```\r\n　　上述执行其实对应的是下面三条语句：\r\n```javascript\r\nfn(); \r\narguments[0]();\r\nfn.call(obj, 12);\r\n```\r\n　　通过将函数赋值给函数参数(`fn`)，然后调用`fn`,这个时候能匹配到的`this`类型就是第一条**默认绑定**，因为实在非严格模式下，所以`this`绑定的是`window`，当然首先输出的是`10`。\r\n　　先解释一下第三个，这个也很简单，因为用了`call`,所以实际匹配了`显示绑定`，所以当前`this`绑定了`obj`,那么输出的肯定是`2`。\r\n　　下面着重解释一下第二个，这个我当时理解成和第一次完全一样，但实际并不是的，其实在JavaScript中数组算是一种特殊的对象（关于JavaScript对象的部分，我现在还在写，下一篇就会出的），`arguments[0]`其实就是通过对象的属性去调用（数组的默认属性类型是数值而普通对象的属性类型是字符串），那么现在其实运用的是规则2，`this`被绑定到`arguments`上，而`arguments`确实存在一个`length`属性，并且值为2（这个别告诉我你看不出来），所以输出的肯定就是`2`啦。\r\n　　可见《你不知道的JavaScript》这本书说的很对，之所以会在ES6出现箭头函数，实质就像用**词法作用域**代替`this`,因为这个真的特别特别容易误用和让人误解。"},"comment":{"url":"https://api.github.com/repos/MrErHu/blog/issues/comments/340956911","html_url":"https://github.com/MrErHu/blog/issues/10#issuecomment-340956911","issue_url":"https://api.github.com/repos/MrErHu/blog/issues/10","id":340956911,"user":{"login":"MrErHu","id":16449143,"avatar_url":"https://avatars3.githubusercontent.com/u/16449143?v=4","gravatar_id":"","url":"https://api.github.com/users/MrErHu","html_url":"https://github.com/MrErHu","followers_url":"https://api.github.com/users/MrErHu/followers","following_url":"https://api.github.com/users/MrErHu/following{/other_user}","gists_url":"https://api.github.com/users/MrErHu/gists{/gist_id}","starred_url":"https://api.github.com/users/MrErHu/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/MrErHu/subscriptions","organizations_url":"https://api.github.com/users/MrErHu/orgs","repos_url":"https://api.github.com/users/MrErHu/repos","events_url":"https://api.github.com/users/MrErHu/events{/privacy}","received_events_url":"https://api.github.com/users/MrErHu/received_events","type":"User","site_admin":false},"created_at":"2017-11-01T02:01:24Z","updated_at":"2017-11-01T02:01:24Z","author_association":"OWNER","body":"@gaozhidong 哈哈，不好意思，手抖了一下，1打成12了"}}
{"actor":{"display_login":"MrErHu"}}