Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Angular 2 (or 4) object serialization

Recently come across the following conundrum:

Standards

The Typescript documentation suggests creating object definitions with private members having an underscore prefix, allowing getters/setters to utilize the original 'name' of said members, providing indirect public access (as they should).

The Angular documentation recommends otherwise, however does not provide an example of using getters & setters for the private variable in their object definition example.

The Issue

I've been following the Typescript coding standard to the most extent. Take the following class for example:

public class Foo{
    private _bar:string;

    constructor(){ this._bar='Baz'; }

    get bar():string{return this._bar}
}

Using the following code to serialize it into JSON:

console.log(JSON.stringify(new Foo()));

...will produce:

{
    '_bar': 'Baz'
}

Questions

  1. Taking into account these are 'guidelines' and simply recommendations, what would be the Angular-way of handling an object definition, allowing for direct serialization?
  2. In my example, surely the private access modifier shouldn't allow direct access to the value of it? What have I missed in my understanding of using the private access modifier here?

I've done a fair share of reading to other articles and StackOverflow posts regarding different ways of handling serialization, want to deter from the 'how', and rather ask 'why' with regards to the behavior mentioned.

Any feedback would be greatly appreciated! :)

Kind regards

like image 408
jarodsmk Avatar asked Jun 07 '17 08:06

jarodsmk


People also ask

Why is serialization not good?

It is not future-proof for small changes If you mark your classes as [Serializable] , then all the private data not marked as [NonSerialized] will get dumped. You have no control over the format of this data. If you change the name of a private variable, then your code will break.

How many types of serialization that are commonly used?

There are three types of serialization in . Net : Binary Serialization, SOAP Serialization and XML Serialization.

Why do we need Serializers?

Serialization allows the developer to save the state of an object and re-create it as needed, providing storage of objects as well as data exchange. Through serialization, a developer can perform actions such as: Sending the object to a remote application by using a web service.

What is serialization in angular?

Serialization is the process of saving and loading for state persistence of the diagram.

How to serialize an object in JavaScript?

Serialization is the process of converting complex objects into a data format that can be easily stored or sent across a network connection. In JavaScript, serialization and deserialization of objects can be achieved by using JSON.stringify () and JSON.parse (). The Problem?

What is the history of AngularJS?

This first version of the framework known as AngularJS was launched in the year 2009. It laid the foundation of the present-day front-end application development. Angular JS was one of the best single-page application development solution. Gradually, it wide adoption and become very popular. What is Angular JS? What is Angular 2? Why not Angular 3?

How to write an angular 2 code?

AngularJS code can write by using only ES5, ES6, and Dart. We can use ES5, ES6, Typescript to write an Angular 2 code. Based on controllers whose scope is now over. Nowadays, the controllers are replaced by components, and Angular two is completely component based.

What is the difference between angular 2 and 4?

Angular 4 is a web application framework for building JavaScript applications. It supports TypeScript, which compiles to JavaScript and displays the same in the browser. It also provides navigation toolbar, auto-complete, menus and many more features. It is unlike Angular 2, which is a completely rewritten version of Angular 1.


1 Answers

You can customize serialization by implementing toJSON()

public class Foo{
    private _bar:string;

    constructor(){ this._bar='Baz'; }

    get bar():string{return this._bar}

    toJSON() {
      return {bar: _bar};
    }

    static fromJSON(json) {
      ...
    }
}

See also http://choly.ca/post/typescript-json/

Getters and setters are pure TypeScript language feature and entirely unrelated to Angular.

private is only for static analysis in TypeScript. When it's transpiled to JS private won't exist anymore. It becomes a plain old JS object and JSON.stringify treats it like that.

like image 93
Günter Zöchbauer Avatar answered Oct 27 '22 02:10

Günter Zöchbauer