После разговора об основах объектов в
предыдущей статье , во второй части этой серии статей — «
Голый Javascript» , мы еще немного поговорим об объектах, их свойствах и рассмотрим функции в javascript.
Как мы узнали из предыдущего поста, в Javascript вы можете создавать объекты одного класса, но каждый объект может иметь свой набор или свойства. Свойства могут быть определены для объектов javascript даже после того, как они были объявлены и использованы любое количество раз. Например, вы можете сделать это в JavaScript.
var bingo = {name:'xyz'};
bingo.says = 'hello';
bingo.volume = 5;
Как видите, вы можете добавлять свойства к объекту javascript даже после того, как объект был объявлен и инициализирован. Это то, что нельзя сделать в Java, потому что каждый объект в Java ДОЛЖЕН подтверждать структуру класса, экземпляром которого он является. Эта возможность иметь возможность динамически создавать новые свойства для существующих объектов в javascript называется расширением.
Если javascript позволяет создавать свойства расширения, он также позволяет удалять их динамически. Вот как вы можете удалить свойство из объекта JavaScript.
delete bingo.volume;
Вышеприведенный оператор удалит свойство тома в объекте бинго, тем самым очистив память, захваченную значением объекта.
Вы можете не только объявлять свойства объектов javascript, но и объявлять функции. Было бы не слишком надуманным утверждать, что функции являются фактическими строительными блоками javascript.
Функции могут быть определены в Javascript несколькими способами.
1) Не очень крутой способ
function doSomethingCool(){
console.log('I do something mindblowingly cool');
}
2) Классный способ — анонимные функции
function (){
console.log('My parents forgot to name me!');
};
Как видите, анонимная функция не имеет имени (и, следовательно, имя «анонимные» функции! Теперь это напоминает мне высказывание — те, у кого нет Бога). Есть много способов, которыми вы можете использовать анонимные функции. Но прежде чем вы начнете использовать функции — анонимные или неанонимные, вам нужно четко помнить одну точку: как и все остальное в javascript, функции тоже являются объектами! что означает, что вы можете присвоить его переменной (да?).
Давайте попробуем опираться на приведенные выше 2 примера и попытаться присвоить эти функции переменным.
function doSomethingCool(){
console.log('I do something cool');
}
var makeSomeNoise = doSomethingCool;
Ой! Страшно! Ну, если вы когда-либо работали с Java, то это может быть. Однако между двумя языками есть некоторые сходства. Когда вы назначаете функцию doSomethingCool переменной makeSomeNoise, вы просто создаете другую ссылку на функцию. Теперь оба объекта — makeSomeNoise и doSomethingCool ссылаются на одну и ту же функцию. Вот почему, если бы мы захотели, мы могли бы переписать первый метод объявления функции, используя второй синтаксис! Смотрите код ниже
var doSomethingCool = function(){
console.log('I do something cool');
}
Этот способ объявления функции doSomethingCool в точности равен методу 1, единственное отличие заключается в синтаксисе. Здесь следует отметить, что имя функции на самом деле является не чем иным, как переменной, объявленной в локальной области видимости.
Хотя «не очень крутой способ» определения функций чрезвычайно удобен в использовании, приведенный выше синтаксис, в котором вы присваиваете переменную анонимной функции, позволяет очень легко всегда помнить, что имя метода не высокое, а объект javascript, хотя и не обычный. Я подробно остановлюсь на этом в следующих статьях.
Теперь, когда вы знаете, что имена функций на самом деле являются объектами, вы можете делать с ними странные вещи. То, что вы никогда не могли бы сделать с помощью Java. Например, взгляните на код ниже
//Define the function
function doSomethingCool(){
console.log('I do something cool');
}
//Invoke the function
doSomethigCool();
//Assign the function name to point to a different function
doSomethingCool = function(){
console.log('I do something hot');
}
//Invoke the function again
//This time the function will print a different message
doSomethingCool();
Проверьте консоль вашего браузера, чтобы проверить вывод. (На тот случай, если вы не знаете, если вы используете Google Chrome, вы можете нажать F12 или Ctrl + Shift + I, чтобы открыть инструменты разработчика Chrome и щелкнуть на вкладке «Консоль». Если вы используете Firefox, вам необходимо установить Расширение Firebug и затем вы можете нажать F12, чтобы получить консоль Firebug, а затем выберите вкладку «консоль» для просмотра сообщений консоли)
Еще одна интересная вещь, которую вы, возможно, захотите узнать о функциях, — это способ ее вызова. В приведенных выше примерах мы создали несколько функций и присвоили им имена. После этого мы смогли вызвать их, используя обычный синтаксис вызова функций. Но что нам делать, если мы хотим вызвать анонимную функцию? Решение простое (и интересное!)
(function(){
console.log('I am anonymous');
}) ();
Обратите внимание на фигурные скобки, которые содержат определение анонимной функции, и фигурные скобки, которые следуют за именем функции. Используя приведенный выше синтаксис, вы можете вызывать не только анонимную функцию, но и любую функцию. давайте посмотрим на пример.
var usefulStuff = (function makeUsefulStuff(){
var bingo={desc:'My name is Bingo'};
return bingo;
})();
Соблюдайте синтаксис внимательно. Я просто создал функцию и вызвал ее. Внутри функции я создал локальную переменную в функции «bingo», и это то, что я вернулся из функции. Непосредственный вызов функции вызывает выполнение оператора return. Итак, теперь переменная goodStuff и переменная бинго указывают на один и тот же объект. Обратите внимание, что в этом случае, просто потому, что мы вызвали функцию немедленно, полезнымStuff не ссылается на функцию, вместо этого он ссылается на обычный объект, который был возвращен функцией. Вполне возможно, что при чтении чужого кода вы можете забыть прочитать фигурные скобки. Ведь они такие крошечные и близко друг к другу. Но на тот случай, если вы обнаружите, что ожидаете один объект и действительно получаете другой,не забудьте искать подлую пару фигурных скобок где-то после определения функции, и вы можете просто сэкономить себе кучу волос.
Возвращаясь к теме объявления функций как свойств объекта, sytnax довольно прост. Проверьте пример кода ниже
//Create an object;
var coolObject ={};
//Declare a function on the object
coolObject.doSomethingCool=function(){
console.log('Do something cool');
};
Хотя мы говорим, что объявляем функцию для объекта, на самом деле мы ничего не делаем, кроме создания нового свойства для объекта, которое ссылается на определение функции. Это означает, что вы можете даже сделать следующее.
var coolObject ={};
//Declare a function on the object
coolObject.doSomethingCool=function(){
console.log('Do something cool');
};
coolObject.doSomethingCool();
//What!! You can even make it a string now! No way!
//But apparently you can!
coolObject.doSomethingCool = 'I am a string';
console.log(coolObject.doSomethingCool);
Кажется, это работает, потому что свойство doSomethingCool было не чем иным, как ссылкой на функцию. Мы можем переназначить все, что пожелаем, в любой момент времени.
Ну, это охватывает несколько нюансов функций. Но есть еще много интересных вещей, которые мы расскажем в следующих статьях! Оставайтесь в курсе!
Счастливого Fungramming!
Райан