简体   繁体   中英

Get and set properties in Javascript

Problem with the next decision... I have an object User, which contains only 1 property:

function User(fullName) {
  this.fullName = fullName;
}

the first- and lastname are only devided by space. I need to do firstName and lastName properties available by (get), and it has to be possible to change that propirties by (set). For example:

var vasya = new User("Vasya Popkin");

// reading firstName/lastName
alert( vasya.firstName ); // Vasya
alert( vasya.lastName ); // Popkin

// writing в lastName
vasya.lastName = 'Black';

alert( vasya.fullName ); // Vasya Black

fullName has to keep as a property.

My code:

 function User(fullName) { this.fullName = fullName; Object.defineProperty(this, "firstName", { get: function () { return this.fullName.split(' ').slice(0, 1); }, set: function (value) { fullName.split(' ').splice(0, 1, value).join(' '); } }); Object.defineProperty(this, "lastName", { get: function () { return this.fullName.split(' ').slice(1); }, set: function (value) { this.fullName.split(' ').splice(1, 1, value).join(' '); } }); } var vasya = new User("Vasya Popkin"); console.log(vasya.fullName); console.log(vasya.lastName); console.log(vasya.firstName); vasya.lastName = 'Black'; vasya.firstName = 'Jack'; console.log(vasya.fullName); console.log(vasya.firstName); console.log(vasya.lastName); 

But i have some trouble which i cant understand. The code is not working. I cant get new fullName. I think i dont have enough understanding of arrays methods. Please help me to fix this code. Thank you!

  • You are not setting the fullName property in set
  • splice returns the deleted items from the array. So, using join on what the splice returns won't work;

So, you need to change the set logic to couple more steps like this:

 function User(fullName) { this.fullName = fullName; Object.defineProperty(this, "firstName", { get: function() { return this.fullName.split(' ')[0]; }, set: function(value) { var names = this.fullName.split(' '); // array of 2 names names.splice(0, 1, value); // update the array this.fullName = names.join(' '); // set full name } }); Object.defineProperty(this, "lastName", { get: function() { return this.fullName.split(' ')[1]; }, set: function(value) { var names = this.fullName.split(' ') names.splice(1, 1, value) this.fullName = names.join(' '); } }); } var vasya = new User("Vasya Popkin"); console.log(vasya.fullName); console.log(vasya.lastName); console.log(vasya.firstName); vasya.lastName = 'Black'; vasya.firstName = 'Jack'; console.log(vasya.fullName); console.log(vasya.firstName); console.log(vasya.lastName); 

Preface: Please see my comment .

The problems with the code are:

  1. That you're using slice and returning the result (an array), but really what you want to do is access the entry in the array at index 0 (first name) or 1 (last name).

  2. You're using the return value of splice , which is an array of the deleted items, not the remaining ones.

  3. You're not setting the fullName property in your setter. (Assigning to entries in the array resulting from split doesn't change the string that split created the array from.)

I wouldn't try to do it with a one-liner (it's possible, it's just harder to understand, debug, and maintain). See comments on firstName ( lastName is just the same sort of thing, but handling the case where there is no space):

 function User(fullName) { this.fullName = fullName; Object.defineProperty(this, "firstName", { get: function () { // Return just the part at index 0 of the array after split return this.fullName.split(' ')[0]; }, set: function (value) { // Split into parts var parts = this.fullName.split(' '); // Set the first part parts[0] = value; // Join back into a string this.fullName = parts.join(' '); } }); Object.defineProperty(this, "lastName", { get: function () { return this.fullName.split(' ')[1] || ""; }, set: function (value) { var parts = this.fullName.split(' '); parts[1] = value; this.fullName = parts.join(' '); } }); } var vasya = new User("Vasya Popkin"); console.log(vasya.fullName); console.log(vasya.lastName); console.log(vasya.firstName); vasya.lastName = 'Black'; vasya.firstName = 'Jack'; console.log(vasya.fullName); console.log(vasya.firstName); console.log(vasya.lastName); 

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM