Реактивное программирование - одна из самых горячих тем сегодня. С учетом того, что библиотеки, такие как RxJs, и большие фреймворки, такие как React или Angular, приняли его, это становится еще более важным.
RxJs представляет один основной тип, называемый Observable. Это самое важное понятие во всей библиотеке. Скорее всего, вы уже слышали о таких концепциях, как подписчик или наблюдатель. В этом блоге я хочу взглянуть на эти концепции и подумать о Observable как о мощной функции.
Наблюдаемые ленивы
Наблюдаемые ленивы. Это означает, что они ничего не делают, пока вы на них не подпишетесь. То же самое и с функциями. Давайте посмотрим на следующий фрагмент.
function foo(){
console.log('The answer to life')
return 42
};
Эта функция ничего не делает, пока мы не вызовем ее с помощью:
console.log(foo()) // or // console.log(foo.call())
Обратите внимание на сходство между этим кодом и кодом Observable:
const foo = Rx.Observable.create(function(observer){
console.log('The answer to life'
observer.next(42)
})
foo.subscribe(function(answer){
console.log(answer)
})
Наблюдаемые и функции ленивы. Они оба делают что-то только тогда, когда вы им звоните.
Observable может выдавать несколько значений
До сих пор мы видели, что у функции и Observable много общего. В чем на самом деле разница между этими двумя? Основное отличие состоит в том, что наблюдаемое может испускать несколько значений. Давайте посмотрим на следующую наблюдаемую.
const foo = Rx.Observable.create(function(observer){
console.log('Possible answers to life')
observer.next(42)
observer.next(12)
observer.next(13)
})
foo.subscribe(function(answer){
console.log(answer)
})
// Output
'Possible answers to life'
42
12
13
Это происходит потому, что наш Observable вызывает функцию обратного вызова, которую мы передаем. В реактивном программировании эти функции обратного вызова называются Observer. Вы можете передать либо три функции обратного вызова, либо объект Observer со свойствами next, error и complete. Как я уже сказал, основное различие между наблюдаемым объектом и функцией состоит в том, что объект Observable может генерировать несколько значений. Вы не можете сделать это с функцией, если не используете что-то вроде генераторов ES6. Но в целом функция может возвращать только одно значение.
Но что произойдет, если мы передадим обратный вызов нашей функции и вызовем ее так же, как это делает Observable?
function foo(callback){
console.log('The answer to life')
callback(42)
callback(12)
callback(13)
};
foo(function(answer){
console.log(answer)
})
Еще раз обратите внимание на сходство. Observable в основном делает то же самое. Он уведомляет ваши функции обратного вызова, называемые Observer.
Понравилось то, что вы прочитали? Если вам понравился этот пост в блоге, пожалуйста, хлопайте в ладоши, поделитесь со мной или подпишитесь на меня. Хотите применить то, что вы узнали из этого поста, и написать свой собственный Observable? Тогда ознакомьтесь с моей статьей «Демистификация наблюдаемых» на нем.
