Javascript – Typescript : underscore convention for members

ecmascript-6es6-classjavascripttypescripttypescript2.0

I have a class Email

class Email {
  private _from: string;
  private _to: Array<string>;
  private _subject: string;
}

It'll create an email object something like:

{
  _from:'',
  _to:'',
  _subject:''
}

This seems a little weird to me since I cannot directly use this object to send to a function . Instead I'll have to transform the object so that it doesn't have underscores . So how do I use the underscore convention or do I have to transform the object .

EDIT : If I do drop the '_'

How do I name the getters and setters if we name the private variables without underscore? A VSCode plugin called Typescript toolbox creates them something like this

public get $subject(): string { 
  return this.subject;
}

Is $ a good convention ?

Best Answer

Those who say, must not use the "_", for them, here is some code from TypeScript site:

class Employee {
    private _fullName: string;

    get fullName(): string {
        return this._fullName;
    } 
    this._fullName = ......
}

Same question on Stackoverflow, you should have a look on it, especially the answer.

For the time being, if accepted, we should not use _, then what are other better ways?

Let's take your example of email, if we will not use _ then, we will come something like this:

member: to,      get/set: emailTo
member: from     get/set: emailFrom

might be you can think some better name, but every time you need to think, which is not very common in the developer world!

Using _ and the same name for a property is easy to check the code otherwise we will be keep mapping which property to which member.

BUT: If you have been forced by your lead at your company then you can use $ for member and property without it; not a rule but easy way:

class Employee {
    private fullName$: string;

    get fullName(): string {
        return this.fullName$;
    } 
    this.fullName$ = ......
}

The Choice Is Yours!!!

Related Solutions

Javascript – n “exists” function for jQuery

In JavaScript, everything is 'truthy' or 'falsy', and for numbers 0 means false, everything else true. So you could write:

if ($(selector).length)

You don't need that >0 part.

Javascript – Which “href” value should I use for JavaScript links, “#” or “javascript:void(0)”

I use javascript:void(0).

Three reasons. Encouraging the use of # amongst a team of developers inevitably leads to some using the return value of the function called like this:

function doSomething() {
    //Some code
    return false;
}

But then they forget to use return doSomething() in the onclick and just use doSomething().

A second reason for avoiding # is that the final return false; will not execute if the called function throws an error. Hence the developers have to also remember to handle any error appropriately in the called function.

A third reason is that there are cases where the onclick event property is assigned dynamically. I prefer to be able to call a function or assign it dynamically without having to code the function specifically for one method of attachment or another. Hence my onclick (or on anything) in HTML markup look like this:

onclick="someFunc.call(this)"

onclick="someFunc.apply(this, arguments)"

Using javascript:void(0) avoids all of the above headaches, and I haven't found any examples of a downside.

So if you're a lone developer then you can clearly make your own choice, but if you work as a team you have to either state:

Use href="#", make sure onclick always contains return false; at the end, that any called function does not throw an error and if you attach a function dynamically to the onclick property make sure that as well as not throwing an error it returns false.

Use href="javascript:void(0)"

The second is clearly much easier to communicate.

Best Answer

Related Solutions

Javascript – n “exists” function for jQuery

Javascript – Which “href” value should I use for JavaScript links, “#” or “javascript:void(0)”

Related Topic