Detailed interpretation of JavaScript arrow function generator Date JSON

Now I will bring you a brief analysis of JavaScript arrow function generator Date JSON. Let me share it with you now and give it as a reference for everyone.

The ES6 standard adds a new function: Arrow Function.

　　　　x => x *x
　　　　上面的箭头相当于:
　　　　　　function (x){ 
　　　　　　　　　　return x*x;
　　　　　　}

Arrow functions are equivalent to anonymous functions and simplify function definition. One like the one above contains only one expression,

even { ... } and return are omitted. There is also a method that can contain multiple statements. In this case, { ... } and return cannot be omitted:

　　　　　　　　x =>{ 
　　　　　　　　　　if(x > 0){ 
　　　　　　　　　　　　return x * x;
　　　　　　　　　　}else{ 
　　　　　　　　　　　　return -x *x;
　　　　　　　　　　}
　　　　　　　　}

If there is not one parameter, it needs to be enclosed in brackets ():

　　　　// 两个参数
　　　　　　(x,y) => x*x + y *y
　　　　// 无参数；
　　　　　　() =>3.14
　　　　// 可变参数
　　　　　　(x,y,...rest) =>{ 
　　　　　　　　var i, sum = x +y;
　　　　　　　　for(i=0;i<rest.length;i++){ 
　　　　　　　　　　sum += rest[i];
　　　　　　　　}
　　　　　　return sum;
　　　　}

this

Now, the arrow function completely fixes the pointing of this. This always points to the lexical scope, which is the outer caller obj:

　　　　var obj = { 
　　　　　　　　birth:1990,
　　　　　　　　getAge:function(){ 
　　　　　　　　var b = this.birth; // 1990
　　　　　　　　var fn = () => new Date().getFullYear() - this.birth; // this指向obj 对象。
　　　　　　　　return fn();
　　　　　　　　}
　　　　}
　　　　obj.getAge(); // 25

If arrow functions are used, the previous hack writing method;

var that = this;

is no longer needed.

Since this has been bound in the arrow function according to whether it is scoped or not, when calling the arrow function with call() or apply(), this cannot be

bound, that is The first parameter passed in is ignored.

　　　　var obj = { 
　　　　　　　　birth:1990,
　　　　　　　　getAge:function(year){ 
　　　　　　　　　　var b = this.burth; // 1990
　　　　　　　　　　var fn = (y) =>y-this.birth; // this.birth 仍是1990
　　　　　　　　　　return fn.call({birth:2000},year);
　　　　　　}
　　　　};
　　　　obj.getAge(2015); // 25

generator

generator (generator) is a new data type introduced by the ES6 standard. A generator looks like a function, but can return multiple times.

　　　　function* foo(x){ 
　　　　　　　　yield x +1;
　　　　　　　　yieldx + 2;
　　　　　　　　return x +3;
　　　　}

The difference between generator and function is that generator is defined by function* (note the extra * sign), and, in addition to the return statement, you can also use yield to return multiple times.

The function can only return once, so Tourmaline returns an Array. However, if it is replaced with a generator, it can return one number at a time and multiple times.

　　　　function* fib(max){ 
　　　　　　　　var t,
　　　　　　　　a = 0,
　　　　　　　　b=1,
　　　　　　　　n=1;
　　　　　　　　while (n < max){ 
　　　　　　　　　　yield a;
　　　　　　　　　　t = a +b;
　　　　　　　　　　a = b;
　　　　　　　　　　b = t;
　　　　　　　　　　n++;
　　　　　　　　}
　　　　　　　　return a; 
　　　　　　}

Try calling directly:

fib(5); // fib {[[GeneratorStatus]]: "suspended", [[GeneratorReceiver]]: Window}

Directly calling a generator is different from calling a function. fib(5) only creates a generator object and has not yet executed it.

There are two methods for calling the generator object. One is to continuously call the next() method of the generator object:

　　　　var f = fib(5);
　　　　f.next(); // {value: 0, done: false}
　　　　f.next(); // {value: 1, done: false}
　　　　f.next(); // {value: 1, done: false}
　　　　f.next(); // {value: 2, done: false}
　　　　f.next(); // {value: 3, done: true}

Date

In JavaScript, Date objects are used to represent dates and times.

To get the current system time, use:

　　　　var now = new Date();
　　　　now; //// Wed Jun 24 2015 19:49:22 GMT+0800 (CST)
　　　　now.getFullYear(); //2015，年份
　　　　now.getMonth(); // 5,月份，注意月份范围为0~11,5表示六月
　　　　now.getDate();// 24 ,表示24 号
　　　　now.getHours(); // 3,表示星期三
　　　　now.getMinutes(); // 19 ,24小时制
　　　　now.getSeconds(); // 22,秒
　　　　now.getMilliseconds(); //875 毫秒
　　　　now.getTime(); // 1435146562875， 以number形式表示的时间戳
　　　　如果要创建一个执行日期和时间的Date对象，可以用：
　　　　var d = new Date(2015,5,19,20,15,30,123);
　　　　d;// Fri Jun 19 2015 20:15:30 GMT+0800 (CST)

JSON

JSON is the abbreviation of JavaScript Object Notation, which is A data exchange format.

In JSON, there are only a few data types:

1, number: It is exactly the same as JavaScript’s number;

2, boolean: It is JavaScript’s true or false;

3, String: It is the String of JavaScript;

4, null: It is the null of JavaScript;

5, array: It is the Array representation of JavaScript—— [];

6,object: It is the {...} representation of JavaScript.

SON also stipulates that the character set must be UTF-8, so there is no problem if it represents multiple languages. For unified parsing, JSON strings must use double quotes "", and Object keys must also use double quotes "".

Serialization

var guagua = {
name: '小明',
age: 14,
gender: true,
height: 1.65,
grade: null,
'middle-school': '\"W3C\" Middle School',
 skills: ['JavaScript', 'Java', 'Python', 'Lisp']
};
 JSON.stringify(xiaoming); // '{"name":"小明","age":14,"gender":true,"height":1.65,"grade":null,"

middle-school":"\"W3C\" Middle School","skills":　　["JavaScript","Java","Python","Lisp"]}'

Result:

　　{
"name": "小明",
"age": 14,
"gender": true,
"height": 1.65,
"grade": null,
"middle-school": "\"W3C\" Middle School",
"skills": [
　　"JavaScript",
　　"Java",
　　"Python",
　　"Lisp"
　　]
　　}

The second parameter is used to control how to filter the key value of the object, if we only want to output the specified Attributes can be passed into Array:

JSON.stringify(xiaoming, ['name', 'skills'], ' ');

Result:

{
　　"name": "guagua",
　　"skills": [
　　"JavaScript",
　　"Java",
　　"Python",
　　"Lisp"
]
　　}

Also You can pass in a function, so that each key-value pair of the object will be processed by the function first:

function convert(key, value) {
if (typeof value === 'string') {
　　return value.toUpperCase();
}
　　return value;
}
JSON.stringify(guagua, convert, ' ');

The above code changes all attribute values ​​​​to uppercase:

{
　　"name": "guagua",
　　"age": 14,
　　"gender": true,
　　"height": 1.65,
　　"grade": null,
　　"middle-school": "\"W3C\" MIDDLE SCHOOL",
　　"skills": [
　　"JAVASCRIPT",
　　"JAVA",
　　"PYTHON",
　　"LISP"
]
　　}

If we still want to To precisely control how to serialize Xiaoming, you can define a toJSON() method for xiaoming, which directly returns the data that JSON should serialize:

Deserialization

Get To a string in JSON format, we directly use JSON.parse() to turn it into a JavaScript object:

JSON.parse('[1,2,3,true]'); //[1,2,3,true]
JSON.parse('{"name":"瓜瓜"，"age":14}'); // Object{name:'瓜瓜'，age:14}
JSON.parse('true'); // true
JSON.parse('123.45'):// 123.45

JSON.parse()还可以接收一个函数，用来转换解析出的属性：
JSON.parse('{"name":"guagua","age":14}',function(key,value){ 
//把number * 2
if(key ==='name'){ 
return value + '同学'
}
return value;
}) ; // Object{name: '瓜瓜同学'，age: 14}

The above is what I compiled for everyone. I hope it will be helpful to everyone in the future.

Related articles:

In-depth understanding of block-level scope, private variables and module mode in JavaScript (graphic tutorial)

JavaScript output display content (basic tutorial)

The difference between Javascript ordinary functions and constructors (combined with code, detailed interpretation)

The above is the detailed content of Detailed interpretation of JavaScript arrow function generator Date JSON. For more information, please follow other related articles on the PHP Chinese website!