30秒学会 JavaScript 片段 · 2020年2月24日

30秒学会 JavaScript 片段 – serializeForm

Encode a set of form elements as a query string.

Use the FormData constructor to convert the HTML form to FormData, Array.from() to convert to an array, passing a map function as the second argument.
Use Array.prototype.map() and window.encodeURIComponent() to encode each field’s value.
Use Array.prototype.join() with appropriate argumens to produce an appropriate query string.

代码片段

const serializeForm = form =>
  Array.from(new FormData(form), field => field.map(encodeURIComponent).join('=')).join('&');

使用样例

serializeForm(document.querySelector('#form')); // email=test%40email.com&name=Test%20Name