Концептуальный обзор это
При создании функции, ключевое слово, которое это создается (в фоновом режиме), которое связано с объектом, а функция работает в этом объекте. Другими словами, ключевое слово, которое это можно использовать в функции, ссылка на объект, а функция - это свойство или метод этого объекта.
Давайте посмотрим на этот объект:
<! Doctype html> <html lang = "en"> <body> <script> var code = {Living: true, возраст: 23, пол: 'Male', getgender: function () {return cody.gender;}}; console.log (cody.getgender ()); // журналы «Мужчина» </script> </body> </html>Обратите внимание, что в функции GetGender, поскольку внутри объекта Cody мы можем получить гендерный атрибут (то есть Cody.gender). Вы также можете использовать это для получения объекта Cody, потому что это указывает на объект Cody.
<! Doctype html> <html lang = "en"> <body> <script> var code = {Living: true, возраст: 23, пол: 'Male', getgender: function () {return this.gender;}}; console.log (cody.getgender ()); // журналы «Мужчина» </script> </body> </html>В этом.
Тема этого может быть немного запутанной, но это не должно быть. Просто помните, что обычно объект, на который указывает, - это объект, который содержит функцию, а не саму функцию (конечно, есть исключения, такие как использование ключевых слов, новое или call () и Apply ()).
Важные советы
- Ключевое слово это похоже на другие переменные, единственное отличие в том, что вы не можете изменить его.
- В отличие от других параметров и переменных, передаваемых функции, это ключевое слово (не свойство) в объекте, который вызывает функцию.
Как определить ценность этого?
Это передается всем функциям, и его значение зависит от того, когда функция вызывается, когда она запускается. Обратите внимание, потому что это особенное место, которое вам нужно помнить.
В следующем коде у объекта MyObject есть свойство Speedfoo, что указывает на функцию SpecileFoo. Когда функция Sayfoo вызывается в глобальном домене, это указывает на окно -объект. Когда MyObject вызывает функцию, это указывает на MyObject.
Поскольку у MyObject есть свойство под названием Foo, оно используется здесь.
<! Doctype html> <html lang = "en"> <body> <script> var foo = 'foo'; var myObject = {foo: 'i rap myobject.foo'}; var sayfoo = function () {console.log (this ['foo']); }; // дайте myObject свойство Sayfoo и указывайте на его функцию sayfoo myobject.sayfoo = sayfoo; myobject.sayfoo (); // журналы 'I MyObject.foo' 12 sayfoo (); // журналы 'foo' </script> </body> </html>Понятно, что значение этого зависит от того, когда вызывается функция. myobject.sayfoo и sayfoo оба указывают на одну и ту же функцию, но контекст вызова Sayfoo () отличается, поэтому значение этого отличается. Ниже приведен аналогичный код, Head Object (окно) используется явно, надеясь, что он будет полезен для вас.
<! Doctype html> <html lang = "en"> <body> <script> window.foo = 'foo'; window.myobject = {foo: 'i am myobject.foo'}; window.sayfoo = function () {! console.log (this.foo); }; window.myobject.sayfoo = window.sayfoo; window.myobject.sayfoo (); window.sayfoo (); </script> </body> </html>Убедитесь, что, когда у вас есть несколько ссылок, указывающих на одну и ту же функцию, вы четко знаете, что значение этого изменения в зависимости от контекста вызывающей функции.
Важные советы
- Все переменные и параметры, за исключением того, что это принадлежат к статической сферу переменной.
Это указывает на объект головы внутри встроенной функции
Вы можете задаться вопросом, что происходит при использовании этого в функции, встроенной в другую функцию. К сожалению, в ECMA 3 это не соответствует правилам, это не указывает не на объект, где принадлежит функция, а на объект головы (объект оконного браузера).
В следующем коде это в Func2 и Func3 больше не указывает на MyObject, а на главный объект.
<! Doctype html> <html lang = "en"> <body> <script> var myobject = {func1: function () {console.log (this); // регистрирует myObject varfunc2 = function () {console.log (this); // журналы окно и сделают это с этой точки на varfunc3 = function () {console.log (this); // Журналы окна, как это главный объект} (); } (); }}; myobject.func1 (); </script> </body> </html>Однако в Ecmascript 5 этот вопрос будет исправлен. Теперь вы должны знать об этой проблеме, особенно когда вы передаете значение одной функции другой.
Посмотрите на код ниже, передайте анонимную функцию Foo.func1. Когда анонимная функция вызывается в foo.func1 (функция вложена в другую функцию), это будет указывать на объект головы в анонимной функции.
<! Doctype html> <html lang = "en"> <body> <script> var foo = {func1: function (bar) {bar (); // WORDS WINHOK, а не foo console.log (this); // Это ключевое слово здесь будет ссылкой на объект foo}}; foo.func1 (function () {console.log (this)}); </script> </body> </html>Теперь вы не забудете, что если функция, содержащая это в другой функции, или вызван другой функцией, значение этого будет указывать на объект головы (опять же, это будет исправлено в Ecmascript 5.)
Решить проблему вложенных функций
Чтобы предотвратить это потеряно, вы можете использовать цепочку сфера в родительской функции, чтобы сохранить ссылки на это. В следующем коде, используя переменную, называемую это, используя ее область, мы можем лучше сохранить контекст функции.
<! Doctype html> <html lang = "en"> <body> <script> var myobject = {myproperty: 'iCanseeHelight', mymethod: function () {var that = this; // хранить ссылку на эту (iemyobject) в MyMethod Scope varhelperfunction function () {// wardfunction var helperfunction function () {// childfunction // logs 'Я могу видеть свет с помощью цепочки сфера, потому что это = this console.log (that.myproperty); // журналы «Я вижу светлую консоль» (это); // регистрирует объект окна, если мы не используем "that"} (); }} myObject.mymethod (); // вызвать mymethod </script> </body> </html>Контролировать значение этого
Значение этого обычно зависит от контекста, в котором называется функция (если не используется ключевое слово, которое будет введено позже), но вы можете использовать Apply () или Call () для указания объекта, на который указывает, когда функция запускается для изменения/управления значением этого. Использование этих двух методов похоже на то, чтобы сказать еще раз: «Эй, назовите функцию x, но пусть объект Z сделает это значение». Это будет изменено значение по умолчанию этого JavaScript.
Ниже мы создаем объект и функцию, а затем запускаем функцию через Call (), поэтому это в функции указывает на myojbect. Это в функции мифункции работает на myObject вместо головного объекта, поэтому мы изменяем объект, на который указывается на это на мифункции.
<! Doctype html> <html lang = "en"> <body> <script> var myobject = {}; var myfunction = function (param1, param2) {// setViacall () 'Это «точка к моему объекту, когда функция призвана this.foo = param1; this.bar = param2; console.log (это); // журналы объект {foo = 'foo', bar = 'bar'}}; myfunction.call (myobject, 'foo', 'bar'); // Вызов функции, установите это значение на myobject console.log (myobject) // logs object {foo = 'foo', bar = 'bar'} </script> </body> </html>В приведенном выше примере мы использовали Call (), Apply () также можно применять к тому же использованию. Разница между ними заключается в том, как параметры передаются в функцию. Используйте Call (), параметры разделены запятыми и Apply (), а параметры передаются в массиве. Ниже приведен тот же код, но используйте Apply ().
<! Doctype html> <html lang = "en"> <body> <script> var myobject = {}; var myfunction = function (param1, param2) {// Установить через Apply (), это указывает на мой объект, когда функция вызывается this.foo = param1; this.bar = param2; console.log (это); // журналы объект {foo = 'foo', bar = 'bar'}}; myfunction.apply (myobject, ['foo', 'bar']); // Вызов функции, установите это значение console.log (myobject); // журналы Object {foo = 'foo', bar = 'bar'} </script> </body> </html>Используйте это в пользовательском конструкторе
Когда функция запускается с новым ключевым словом, значение этого объявляется в конструкторе, чтобы указывать на сам экземпляр. Другими словами: в конструкторе мы можем использовать его для указания объекта до его факта создания. Похоже, это изменяет это значение на Call () или Apply ().
Ниже мы строим конструктор, который указывает на созданный объект. Когда объект человека создается, это указывает на этот объект и помещает имя свойства в объект, а значение - значение параметра (имя), передаваемое этому конструктору.
<! Doctype html> <html lang = "en"> <body> <script> var person = function (name) {this.name = name || «Джондо»; // это будет относиться к созданному мгновенному} var code = new Person ('Cody Lindley'); // Создать экземпляр, основанный на конструкторе лица. Console.log (cody.name); // журналы 'Cody Lindley' </script> </body> </html>Таким образом, когда конструктор запускается с новым ключевым словом, это указывает на «объект для создания». Затем, если мы не используем новое ключевое слово, значение этого укажет на контекст, который запускает человека - это объект головы. Давайте посмотрим на код ниже.
<! Doctype html> <html lang = "en"> <body> <script> var person = function (name) {this.name = name || 'johndoe'; } var code = person ('cody lindley'); // Уведомление мы не использовали «new» console.log (cody.name); // не определенное, значение фактически устанавливается на window.name console.log (window.name); // журналы 'Cody Lindley' </script> </body> </html>Это указывает на экземпляр конструктора в методе прототипа
Когда метод используется в качестве свойства прототипа конструктора, это в этом методе указывает на экземпляр метода триггера. Здесь у нас есть конструктор человека (), который требует полного имени человека. Чтобы получить полное имя, мы добавляем метод WhatismofullName в Person.prototype, и все экземпляры человека наследуют этот метод. Этот метод указывает на экземпляр (и его свойства), который вызвал этот метод.
Ниже я создал два человека объектов (Коди и Лиза), а унаследованный метод WatismyfullName содержит этот момент в этом случае.
<! Doctype html> <html lang = "en"> <body> <script> var person = function (x) {if (x) {this.fullname = x}; }; Person.prototype.whatismyfullname = function () {return this.fullname; // «Это» относится к экземпляру, созданному из Person ()} var code = new Person ('Cody Lindley'); var lisa = новый человек ('Лиза Линдли'); // Вызовите унаследованный метод WhatismfullName, который использует его для обозначения Console.log (cody.whatismyfullname (), lisa.whatismyfullname ()); /* Цепочка прототипов все еще действует, поэтому, если экземпляр не имеет полнокамерного свойства, она будет искать его в цепочке прототипа. Ниже мы добавляем полнокамерное свойство как в прототип человека, так и в прототип объекта. Смотрите примечания. */Object.prototype.fullname = 'John Doe'; var John = new Person (); // нет аргументации не передается так полное имя не добавляется в console.log (john.whatismyfullname ()); // журналы «Джон Доу» </script> </body> </html>Используйте это в методе внутри объекта прототипа, и это указывает на экземпляр. Если экземпляр не содержит атрибутов, начинается поиск прототипа.
намекать
- Если объект, указанный на это, не содержит атрибутов, которые вы хотите найти, то здесь также применим закон, применяемый к любым атрибутам, то есть атрибуты будут «поиск» вдоль цепочки прототипа. Таким образом, в нашем примере, если экземпляр не содержит свойства FullName, то FullName будет искать Person.prototype.fullName, а затем object.prototype.fullname.
Чтобы просмотреть больше синтаксиса JavaScript, вы можете следовать: «Справочный учебник JavaScript» и «Руководство по стилю кода JavaScript». Я также надеюсь, что все будут поддерживать Wulin.com больше.