CODEWITHSUNDEEP
javascriptreactjs
Loran
Loran

Reputation: 852

How to use model in javascript?

I am new in javascript and React. I come from c#. So these two ideas are a lot of different. Now I would like to create a model and initialize it.eg in c#

public class User(){
 public string username{get;set;};
 public string email {get;set;};    
}

I can create a new instance of User in another file like =>

var user= new User();

And I can assign value like => 

user.username="User1";
user.email="[email protected]";

How can I do that kind of same logic in javascript?

First I try to create new js file and do like that=>

export class User{
    constructor(username="",email=""){
        this.username=username;
        this.email=email;
    }
}

export default User;

I import like =>

 import {User} from '../../User';

And I use like =>

var testing = new User();
testing.username="user1";

but it says

Expected an assignment or function call and instead saw an expression no-unused-expressions

I just have the idea. I don't know how to do it. Thanks.

Upvotes: 1

Views: 784

Answers (3)

arizafar
arizafar

Reputation: 3122

You need to add the setter and getter if you want to set the variables after creating the object, not from constructor.

    class User {
    	constructor(name = "", email = "") {
    		this.name = name;
    		this.email = email;
    	}
    
    	set username(name) {
    		this.name = name;
    	}
    
    	get username() {
    		return this.name
    	}
    }
    
    var testing = new User();
    testing.username = "user1";
    console.log(testing.username)
    testing.username = "user2";
    console.log(testing.username)

Upvotes: 2

Andy
Andy

Reputation: 63550

First, import {User} from '../../User'; should be import User from '../../User';. You don't need the curly braces if you're using export default.

(Edit: ravibagul91 is right. I didn't spot your named export. But I'll keep this comment in.)

Second, since your class accepts name and address as arguments to the constructor, just pass them in when you create the new instance:

class User {
  constructor(username = "", email = "") {
    this.username = username;
    this.email = email;
  }
}

const user = new User('bob', '[email protected]');
console.log(user);

Upvotes: 2

syjsdev
syjsdev

Reputation: 1336

import {User} from '../../User'; // this is wrong

try like this

import User from '../../User'; // this is right

because you export the class as default, so you must remove the bracket.

class User {
  constructor(name, email) {
    this.name = name;
    this.email = email;
  }
  
  getName() {
    return this.name;
  }
  
  setName(name) {
    this.name = name;
  }
  
  getEmail() {
    return this.email;
  }
  
  setEmail(email) {
    this.email = email;
  }
  
  present() {
    return "my name is " + this.name + " and my email is " + this.email;
  }
}

var user1 = new User("User1", "[email protected]");
var user2 = new User();
user2.setName("User2");
user2.setEmail("[email protected]");

console.log(user1.present());
console.log(user2.present());
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>

Upvotes: 0

Related Questions