Difference between PUT and DELETE request in Vanilla JavaScript - GeeksforGeeks

02 Sep, 2021
PUT and DELETE are the two different types of HTTP request methods. HTTP protocol supports many methods to transfer data from the server or do any operation on the server. The HTTP protocol supports the following methods, e.g. GET, POST, PUT, DELETE, PATCH, COPY, HEAD, OPTIONS, etc. Before we dive into the main difference between PUT and DELETE request methods, let us look into HTTP methods.
What is PUT request method? It is used when the client is sending a replacement document or uploading a new document to the Web server under the request URL.
What is DELETE request method? It is used when the client is trying to delete a document from the web server, identified by the request URL.
Example: Let us look into an example of PUT request method.
Javascript
function easyHTTP() {     // Initialising new XMLHttpRequest method.    this.http = new XMLHttpRequest();} // Make an HTTP PUT RequesteasyHTTP.prototype.put = function (url, data, callback) {     // Open an object (POST, PATH,    // ASYNC-TRUE/FALSE)    this.http.open('PUT', url, true);     // Set content-type    this.http.setRequestHeader(        'Content-type', 'application/json');     // Assigning this to self to have scope    // of this into the function onload()    let self = this;     // When the response is ready    this.http.onload = function () {         // Callback function (Error, response text)        callback(null, self.http.responseText);    }     // Since the data is an object so    // we need to stringify it    this.http.send(JSON.stringify(data));} // Instantiating easyHTTPconst http = new easyHTTP; // Data that we need to updateconst data = {    title: ‘Custom Putt’,    body: ‘This is a custom put’}; // Put prototype method(url,data,response text)http.put(    'https://jsonplaceholder.typicode.com/posts/5',    data, function (err, post) {         if (err) {            console.log(err);        }        else {            console.log(post);        }     });
Example: The following code demonstrates the DELETE request method.
Javascript
function easyHTTP() {     // Initialising new XMLHttpRequest method.    this.http = new XMLHttpRequest();} // Make an HTTP Delete RequesteasyHTTP.prototype.delete = function (url, callback) {     // Open an object (GET/POST, PATH,    // ASYNC-TRUE/FALSE)    this.http.open('DELETE', url, true);     // Assigning this to self to have     // scope of this into the function    let self = this;     // When the response is ready    this.http.onload = function () {         // Checking status        if (self.http.status === 200) {             // Callback function(Error, response text)            callback(null, 'Post Deleted');        } else {             // Callback function (Error message)            callback('Error: ' + self.http.status);        }    }     // Send the request    this.http.send();} // Instantiating easyHTTPconst http = new easyHTTP; // Delete prototype method(URL,// callback(error,response text))http.delete(    'https://jsonplaceholder.typicode.com/posts/1',    function (err, response) {        if (err) {            console.log(err);        } else {            console.log(response);        }    });
Difference between PUT and DELETE:
sagartomar9927
akshaysingh98088
JavaScript-Misc
JavaScript
Web Technologies
Writing code in comment?
Please use ide.geeksforgeeks.org,
generate link and share the link here.
Remove elements from a JavaScript Array
Convert a string to an integer in JavaScript
Difference between var, let and const keywords in JavaScript
Differences between Functional Components and Class Components in React
How to append HTML code to a div using JavaScript ?
Remove elements from a JavaScript Array
Installation of Node.js on Linux
Convert a string to an integer in JavaScript
How to fetch data from an API in ReactJS ?
Top 10 Projects For Beginners To Practice HTML and CSS Skills