#javascript #reactjs #find #brackets
#javascript #reactjs #Найти #скобки
Вопрос:
У меня есть следующий пример. Обе функции find() работают, но я не уверен, как первая с {} передается в функцию обратного вызова.
1. Если используется {}, я предполагаю, что объект передается в функцию find, но как ‘title’ в качестве объекта может использоваться для сравнения со значениями (1.2). Может кто-нибудь, пожалуйста, объяснить основы, со ссылкой будет еще лучше.
2. Я понимаю, что вторая функция поиска передается в object, а arr.title ссылается на значение внутри объекта ‘array1’. Я прав?
const array1 = [{name:1,title:1.1}, {name:2,title:1.2}];
const found = array1.find(({title}) => title ==1.2);
const found2 = array1.find(arr => arr.title ==1.2);
console.log(found);
console.log(found2);
Результатом приведенного выше кода является:
> Object { name: 2, title: 1.2 }
> Object { name: 2, title: 1.2 }
Комментарии:
1. Проблема решена, для тех, кто хочет знать деструктивное назначение понятнее, чем единственная ссылка, которую они предоставили ниже. Вы можете просмотреть это видео на YouTube: youtube.com/watch?v=-vR3a11Wzt0
Ответ №1:
Это не связано с Array.prototype.find
, а скорее является общей особенностью синтаксиса параметров функции JavaScript.
Параметр функции может быть определен с использованием синтаксиса деструктурирования объекта или массива.
Определение функции
function f(x) {
return x.p;
}
Объявляет функцию, которая принимает единственный параметр манифеста с именем x .
Поведенчески идентичная функция
function f({p}) {
return p;
}
Объявляет единственный анонимный параметр манифеста и извлекает его свойство p.
С точки зрения вызывающей стороны, обе функции ведут себя одинаково, и действительно, обе выдадут результат, если первый переданный аргумент не определен, и обе вернут значение undefined, если у x нет свойства p и так далее.
Вторая форма — это чисто синтаксическое удобство, используемое в реализации функций для извлечения свойства с именем p и работы с ним без каких-либо оговорок.
Деструктурирование параметров — это пример общего синтаксиса деструктурирования JavaScript, который имеет другие приложения, включая объявления переменных, присвоения и предоставление значений по умолчанию.
Ответ №2:
Если используется {}, я предполагаю, что объект передается в функцию find…
Это некая магия Javascript, называемая деструктурированием, особый синтаксис.
Что происходит: значение объекта / ов распаковывается их ключами.
Результат: объект разрушен переданным ключом. В результате возвращается значение ключа, которое вы видите в своей функции find.
Чтобы лучше понять деструктурирование, вы можете прочитать здесь или здесь
Однако, чтобы лучше понять, что происходит, вам, вероятно, сначала нужно полностью понять функцию find и как она работает.
Я понимаю, что вторая функция поиска передается в object…
Что происходит: Вы передаете то, что известно как обратный вызов. По сути, вы говорите, что для каждой из записей в моем массиве запустите эту функцию и, основываясь на оценке моего обратного вызова (вашей функции), выдайте мне результат.
Результат: Это означает, что если title равен 1.2 для любого / каждого проверяемого объекта, в случае вашего обратного вызова arr => arr.title ==1.2
он примет значение true и, таким образом, объект будет возвращен.
Комментарии:
1. Спасибо, он охватил все пункты, включая функцию find, которые не были охвачены другими ответами.
Ответ №3:
Что происходит, так это деструктурирующее присвоение: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment
const { title } = { title: 1.2 };
console.log(title); // 1.2