如何向对象添加属性

Question

I need to pass the exact data to the webAPI:

{
 email: "useremail",
 password: "userpassword",
 grant_type: "password"
}

From the login form, I receive the following data:

{
 email: "useremail",
 password: "userpassword"
}

I need to add the grant_type: "password" to the object.

Here is my method

signIn(credentials) {

  console.log(credentials);

  this.authService.login(credentials)

    .subscribe(result => { 
      if (result)
        this.router.navigate(['/']);
      else  
        this.invalidLogin = true; 
    });
}

The credentials is the data coming from the Login form.

Answer 1

If you have this:

let jsonObject = {
  email: "useremail",
  password: "userpassword",
}

I think you can simply do like so

jsonObject['grant_type'] = password;

Otherwise, simple and effective:

let extendedJsonObject = {
  email: jsonObject.email,
  password: jsonObject.password,
  grant_type: 'password'
};

As @jonrsharpe said in the comments, you can also do so:

let extendedJsonObject = { grant_type: 'password', ...jsonObject }

According to @Kyrsberg you can also do

let extendedJsonObject = Object.assign({grant_type: 'password'}, jsonObject);

Answer 2

What you appear to want to do is to add a property to an object. This is one of the most basic operations in all of JavaScript . It is something that you would learn early on in any of the hundreds or thousands of tutorials, intros, beginner books, blog posts, and documentation pages that cover JavaScript.

I strongly suggest you go back and review whatever materials you were using to learn JavaScript. For instance, you could start with this friendly intro to property accessors .

This has nothing to do with TypeScript or Angular. TypeScript is a type layer on top of JS. Angular is an application framework. Your question is purely about JavaScript. It's a bit concerning that you thought this problem might have something to do with TypeScript or Angular. It would indicate you don't actually understand the relationship among the tools you are using, namely JavaScript and TypeScript and Angular. Understand clearly that you are working with the language called JavaScript. You must study it carefully and know it well before even starting to work with TypeScript or Angular.

You also seem deeply confused about the meaning of the term "JSON". JSON is exactly one thing: a text-based format for exchanging information . JavaScript objects are not JSON, although they resemble each other (hence the "J" of "JSON"), and can be converted back and forth ("parsing" and "stringifying"). Your problem has absolutely nothing to do with JSON. The objects you are working with, which include properties such as email , are not JSON. If you insist on calling them JSON--and there is no shortage of similarly misguided folks trying to work in JavaScript--you will merely confuse yourself and those around you. These objects are plain, old, ordinary, JavaScript objects, and that's what you should call them.