Как использовать промисы в RactiveJS?

Несмотря на то, что в документации Ractive есть пример, я начинаю с промисов и не понимаю упомянутый пример:

var Promise = Ractive.Promise;

var p = new Promise( function ( fulfil, reject ) {
  doSomethingAsync( function ( error, result ) {
    if ( error ) {
      return reject( error );
    }

    fulfil( result );
  });
});

Как я могу использовать реализацию Ractive для асинхронного запуска некоторых функций?

Редактировать: Пример использования: когда у меня есть в одной функции синхронные и асинхронные операции, и мне нужно вернуть обещание, когда все эти операции были обработаны.


person Paulo Coghi    schedule 06.04.2015    source источник
comment
Пожалуйста, спросите более конкретную функцию. Какие функции вы хотите/должны реализовать? С какими проблемами вы столкнулись? Покажите нам свою попытку. Если это вопрос о понимании, пожалуйста, поместите соответствующий пример в свой вопрос (их несколько на связанной странице!), И подробно объясните, что вы понимаете, а что нет.   -  person Bergi    schedule 06.04.2015
comment
Спасибо. При условии упомянутого примера и варианта использования   -  person Paulo Coghi    schedule 06.04.2015
comment
Возможно, вы захотите начать с этих эмпирических правил (скорее вопрос дизайна, чем объяснение конструктора Promise). Обычно вы не комбинируете синхронные с асинхронными функциями. У вас есть функции, возвращающие промисы (асинхронные), а затем связывающие их. Не могли бы вы привести конкретный пример того, какие функции у вас есть и какие вы хотите использовать? Может быть, фрагмент кода в стиле обратного вызова (пока никаких обещаний)?   -  person Bergi    schedule 06.04.2015


Ответы (1)


Это больше вопрос о обещаниях, чем о Ractive, поэтому это Статью MDN стоит прочитать, хотя она немного тяжеловата.

В основном, если вы хотите дождаться завершения нескольких операций, используйте Promise.all:

var ready = Promise.all([
  getJSON( '/data.json' ), // async (returns a promise)
  domReady(),              // async
  reticulateSplines()      // sync
]);

getJSON и domReady будут выполняться одновременно. То же самое будет и с reticulateSplines, но это не имеет значения, поскольку оно синхронно. Значение ready теперь является обещанием, которое будет выполнено с массивом, содержащим результаты этих трех операций:

ready.then( function ( values ) {
  var data     = values[0];
  var document = values[1];
  var splines  = values[2];
  // some code happens
}).catch( function ( err ) {
  // if something went wrong with any of those three
  // functions (e.g. couldn't find data.json), we'll
  // end up here
});

Если вы транспилируете свой код с помощью чего-то вроде babel, вы также можете использовать деструктурирование:

ready.then( ([ data, document, splines ]) => {
  // some code happens
}).catch( err => {
  // handle error
});

Еще одна полезная функция, если вы имеете дело с возможно-синхронным-может быть-асинхронным (хотя на самом деле лучше избегать подобных вещей), — это Promise.resolve:

function crazyTown () {
  if ( Math.random() < 0.5 ) {
    return 'sync!';
  } else {
    return new Promise( function ( fulfil, reject ) {
      setTimeout( function () {
        fulfil( 'async!' );
      }, 500 );
    });
  }
}

Promise.resolve( crazyTown() ).then( function ( type ) {
  console.log( type );
});

Если ваш браузер изначально поддерживает промисы, Ractive будет использовать их (например, Ractive.Promise === window.Promise), а если нет, то использует собственную реализацию, соответствующую спецификации.

person Rich Harris    schedule 06.04.2015