jQuery метод .rejectWith()

Определение и применение

jQuery метод .rejectWith() изменяет состояние объекта Deferred на rejected (выполнение отклонено) и вызывает любые, предназначенные для подобных ситуаций функции обратного вызова (failCallbacks) с заданным контекстом и аргументами.

Обращаю Ваше внимание, что метод .rejectWith() аналогичен методу .reject(), за тем исключением, что метод .rejectWith() дополнительно позволяет установить контест исполнения функций обратного вызова (failCallbacks), и в отличии от метода .reject() принимает значения в виде массива, а не любых значений.

jQuery синтаксис:

Синтаксис 1.5:

deferred.rejectWith()
deferred.rejectWith( context )
deferred.rejectWith( context, args )

context - Object

args - Array

Добавлен в версии jQuery

Значения параметров

Пример использования

Метод .rejectWith() — пример 1

Нажмите ▶. Используйте кнопки в результате и наблюдайте изменения. Измените JavaScript и запустите пример повторно. Используется jQuery 4.0.0.

index.html

HTML

<button class="resolve">Resolve</button>
<button class="reject">Reject</button>
<button data-example-event-0="">Page reload</button>

main.js

JavaScript

$(document).ready(function () {
    let dfd = $.Deferred() // создаем объект Deferred
    let obj = {
        // инициализируем объект, содержащий два метода
        code1: 'its ok',
        code2: 'something goes wrong',
    }

    // задаем обработчики, которые будут вызваны при изменении состояния объекта на resolved (успешное выполнение) или rejected (выполнение отклонено)
    dfd.then(function (val) {
        // бдует вызван при изменении состояния объекта на resolved
        console.log(this[val]) // используя полученное значение выводим в консоль значение одноименного свойства объекта на который ссылается объект this
    }).catch(function (val) {
        // бдует вызван при изменении состояния объекта на rejected
        console.log(this[val]) // используя полученное значение выводим в консоль значение одноименного свойства объекта на который ссылается объект this
    })

    $('.resolve').click(function () {
        // задаем функцию при нажатиии на элемент с классом .resolve
        dfd.resolveWith(obj, ['code1']) // изменяем состояние объекта Deffered на resolve и передаем контекст и значение
    })
    $('.reject').click(function () {
        // задаем функцию при нажатиии на элемент с классом .reject
        dfd.rejectWith(obj, ['code2']) // изменяем состояние объекта Deffered на reject и передаем контекст и значение
    })
})

document.querySelector('[data-example-event-0]').addEventListener('click', function (event) {
    window.location.reload()
})

style.css

CSS

body {
  margin: 16px;
  font:
    16px/1.5 system-ui,
    sans-serif;
  overflow-wrap: anywhere;
}
img,
input,
select,
textarea,
button {
  max-width: 100%;
}

В этом примере мы инициализируем переменную, которая содержит объект Deferred, созданный с помощью фабричной функции $.Deferred() и переменную, содержащую объект у которого имеются два метода.

При нажатии на определенный элемент <button>, благодаря установленному обработчику событий "click" на элементе мы в первом случае с помощью метода .resolveWith() изменяем состояние объекта Deferred на resolved (успешное выполнение), передаем контекст выполнения для функций обратного вызова (doneCallbacks) и передаем строковое значение внутри массива, а во втором случае с помощью метода .rejectWith() изменяем состояние объекта Deferred на rejected (выполнение отклонено) и передаем другое строковое значение внутри массива.

С помощью вызова метода .then() на объекте Deferred мы устанавливаем фильтр (doneFilter), который определяет функцию, которая вызывается при изменении состояния объекта Deferred на resolved (успешное выполнение). Эта функция, используя полученное значение выводит в консоль значение одноименного свойства объекта на который ссылается объект this.

С помощью вызова метода .catch() на объекте Deferred мы устанавливаем фильтр (failFilter), который определяет функцию, которая вызывается при изменении состояния объекта Deferred на rejected (выполнение отклонено). Эта функция по аналогии с вызовом метода .then(), используя полученное значение выводит в консоль значение одноименного свойства объекта на который ссылается объект this. Метод .catch( fn ) является сокращенным вариантом вызова метода .then( null, fn ).

Обратите внимание, что в этом примере для сохранения контекста мы не используем стрелочные функции.