cs/Web/API/Headers)
, along with a [ ` fetch() ` ](/en-US/docs/Web/API/fetch) method for
initiating asynchronous resource requests. Because the main components of HTTP
are abstracted as JavaScript objects, it is easy for other APIs to make use of
such functionality.

[ Service Workers ](/en-US/docs/Web/API/Service_Worker_API) is an example of
an API that makes heavy use of Fetch.

Fetch takes the asynchronous nature of such requests one step further. The API
is completely [ ` Promise ` ](/en-
US/docs/Web/JavaScript/Reference/Global_Objects/Promise) -based.

##  Guard

Guard is a feature of [ ` Headers ` ](/en-US/docs/Web/API/Headers) objects,
with possible values of ` immutable ` , ` request ` , ` request-no-cors ` , `
response ` , or ` none ` , depending on where the header is used.

When a new [ ` Headers ` ](/en-US/docs/Web/API/Headers) object is created
using the [ ` Headers() ` ](/en-US/docs/Web/API/Headers/Headers "Headers\(\)")
[ constructor ](/en-US/docs/Glossary/Constructor) , its guard is set to ` none
` (the default). When a [ ` Request ` ](/en-US/docs/Web/API/Request) or [ `
Response ` ](/en-US/docs/Web/API/Response) object is created, it has an
associated [ ` Headers ` ](/en-US/docs/Web/API/Headers) object whose guard is
set as summarized below:

new object's type  |  creating constructor  |  guard setting of associated [ ` Headers ` ](/en-US/docs/Web/API/Headers) object   
---|---|---  
[ ` Request ` ](/en-US/docs/Web/API/Request) |  [ ` Request() ` ](/en-US/docs/Web/API/Request/Request "Request\(\)") |  ` request `  
[ ` Request() ` ](/en-US/docs/Web/API/Request/Request "Request\(\)") with [ ` mode ` ](/en-US/docs/Web/API/Request/mode "mode") of ` no-cors ` |  ` request-no-cors `  
[ ` Response ` ](/en-US/docs/Web/API/Response) |  [ ` Response() ` ](/en-US/docs/Web/API/Response/Response "Response\(\)") |  ` response `  
[ ` Response.error() ` ](/en-US/docs/Web/API/Response/error_static "Response.error\(\)") or [ ` Response.redirect() ` ](/en-US/docs/Web/API/Response/redirect_static "Response.redirect\(\)") methods  |  ` immutable `  
  
A header's guard affects the [ ` set() ` ](/en-US/docs/Web/API/Headers/set
"set\(\)") , [ ` delete() ` ](/en-US/docs/Web/API/Headers/delete "delete\(\)")
, and [ ` append() ` ](/en-US/docs/Web/API/Headers/append "append\(\)")
methods which change the header's contents. A [ ` TypeError ` ](/en-
US/docs/Web/JavaScript/Reference/Global_Objects/TypeError) is thrown if you
try to modify a [ ` Headers ` ](/en-US/docs/Web/API/Headers) object whose
guard is ` immutable ` . However, the operation will work if

  * guard is ` request ` and the header _name_ isn't a [ forbidden header name ](/en-US/docs/Glossary/Forbidden_header_name) . 
  * guard is ` request-no-cors ` and the header _name_ / _value_ is a [ simple header ](/en-US/docs/Glossary/Simple_header) . 
  * guard is ` response ` and the header _name_ isn't a [ forbidden response header name ](/en-US/docs/Glossary/Forbidden_response_header_name) . 

##  Help improve MDN

Was this page helpful to you?

Yes  No

[ Learn how to contribute
](https://github.com/mdn/content/blob/main/CONTRIBUTING.md "This will take you
to our contribution guidelines on GitHub.") .

This page was last modified on  Aug 24, 2023  by  [ MDN contributors ](/en-
US/docs/Web/API/Fetch_API/Basic_concepts/contributors.txt) .

[ View this page on GitHub
](https://github.com/mdn/content/blob/main/files/en-
us/web/api/fetch_api/basic_concepts/index.md?plain=1 "Folder: en-
us/web/api/fetch_api/basic_concepts \(Opens in a new tab\)") â¢  [ Report a
problem with this content
](https://github.com/mdn/content/issues/new?template=page-report.yml&mdn-
url=https%3A%2F%2Fdeveloper.mozilla.org%2Fen-
US%2Fdocs%2FWeb%2FAPI%2FFetch_API%2FBasic_concepts&metadata=%3C%21--+Do+not+make+changes+below+this+line+--%3E%0A%3Cdetails%3E%0A%3Csummary%3EPage+report+details%3C%2Fsummary%3E%0A%0A*+Folder%3A+%60en-
us%2Fweb%2Fapi%2Ffetch_api%2Fbasic_concepts%60%0A*+MDN+URL%3A+https%3A%2F%2Fdev