нокаут, наблюдаемый в нормальных js и в magento 2 js - PullRequest
Новая
       16

нокаут, наблюдаемый в нормальных js и в magento 2 js

0 голосов
/ 25 октября 2018

Что можно наблюдать в обычном программировании и что в JavaScript-среде magento 2, можно отличить, приведя какой-то пример

1 Ответ

0 голосов
/ 25 октября 2018

Observables используются во многих местах, есть много способов понять "obervables", но вам нужно понять, что HTTP-запросы возвращают Observable, который завершается при ответе (или при сбое), он не может на самом делезнать, когда ваш сервер решает «отправить» больше данных, потому что он просто не построен таким образом, ваш сервер отвечает только на запросы.

Что ж, в Magento 2 использование «obervables» немного сложнее.Фреймворки JavaScript в Magento 2 интенсивно используют наблюдаемые, что выходит за рамки того, что нужно знать обычному внешнему разработчику.

Наблюдаемые - это автономные объекты-установщики / получатели.На странице начальной загрузки Magento запустите следующий код в консоли JavaScript вашего браузера.Вы также должны иметь возможность делать это вне Magento в системах, которые используют глобальную переменную ko вместо специального модуля RequireJS в Magento. 

//load the Knockout.js library -- normally you'd do this in a `define`
ko = requirejs('ko');

//create the observable object with a default value
var objectToHoldMyValue = ko.observable('default value');

//fetch that value by calling the observable as a function
console.log( 'Value: ' + objectToHoldMyValue() );
"default value"

//set a new value by calling the observable as a function with an argument
objectToHoldMyValue('new value')

//fetch that value by calling the observable as a function
console.log( 'Value: ' + objectToHoldMyValue() );
"new value"

Как видно из приведенного выше кода и комментариев, первая работанаблюдаемый объект должен хранить значение, возвращать значение и изменять сохраненное значение.Синтаксис может быть немного странным, если вы не привыкли к природе «объекты могут быть анонимными функциями» в javascript, но в этом нет ничего слишком сумасшедшего.Кроме того, в этом нет ничего особенного, пока вы не рассмотрите подписчиков. 

//subscribe to a change
objectToHoldMyValue.subscribe(function(newValue){
console.log("The subscriber sees: " + newValue);
});

Приведенный выше код устанавливает обратный вызов, который, другими словами, является прослушивателем события (т.е. вы подписываетесь на событие).Событие, на которое вы подписываетесь?Изменение значения наблюдаемого.Если вы снова запустите код установки значения. 

objectToHoldMyValue('a second new value')
The subscriber sees: a second new value

вы увидите, что Knockout вызывает ваш метод подписчика.

Важно: Подписчики вызываются только при изменении значения,Если вы передадите текущее значение наблюдаемой, Knockout не будет вызывать обратные вызовы подписчиков 

objectToHoldMyValue('a third new value')
The subscriber sees: a third new value

objectToHoldMyValue('a third new value')
[no output, because the subscriber was not called]

Хотя этот пример немного глуп, в реальной программе наблюдаемые позволяют вам выполнять действия всякий раз, когда значение переменной изменяется.Это невероятно мощная функция.

Для разработчиков на Magento 2

Как разработчик Knockout.js, вы можете жить жизнью, в которой большинство не знают о том, как реализованы наблюдаемые.Разработчики Magento 2 не имеют такой роскоши.Системы компонентов пользовательского интерфейса интенсивно используют наблюдаемые свойства, а также настраивают своих собственных подписчиков.Хорошая новость: когда вы видите что-то вроде 

//...
someProp: ko.observable('default value')
//...

, вам не нужно паниковать.Программа просто использует someProp для хранения значения.Плохая новость в том, что наблюдаемые могут иметь несколько подписчиков.Эти подписчики могут исходить из атрибутов привязки данных шаблона Knockout.js.Они могут исходить из кода ядра Magento, настраивая своих собственных подписчиков.Вы можете просмотреть количество обратных вызовов, которые имеет наблюдатель, с помощью свойства _subscription 

console.log(objectToHoldMyValue._subscriptions);
Object
change: Array[3]
    0: ko.subscription
    1: ko.subscription
    2: ko.subscription

или посмотреть конкретный обратный вызов, подобный этому 

console.log(
objectToHoldMyValue._subscriptions.change[1].callback
);

Однако - вы зависите от своегоОтладчик W / R / T, чтобы показать, как эта информация отображается, и нет простого способа узнать, откуда приходит конкретный подписчик.Кроме того, в этот момент мы углубились во внутренние компоненты Knockout.js, и использование такого рода кода для чего-либо, кроме отладки, создает огромный потенциал для нестабильности.

Ссылка: https://alanstorm.com/knockout-observables-for-javascript-programmers/

...