JavaScript 基础(七) 箭头函数 generator Date JSON
ES6 标准新增了一种新的函数: Arrow Function(箭头函数)。
x => x *x
上面的箭头相当于:
function (x){
return x*x;
}
箭头函数相当于匿名函数,并且简化了函数定义。一种像上面的,只包含一个表达式,
连{ ... }和return都省略掉了。还有一种可以包含多条语句,这时候就不能省略{ ... }和return:
x =>{
if(x > 0){
return x * x;
}else{
return -x *x;
}
}
如果参数不是一个,就需要用括号()括起来:
// 两个参数
(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
现在,箭头函数完全修复了this的指向,this总是指向词法作用域,也就是外层调用者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
如果使用了箭头函数,以前的那种hack 写法;
var that = this;
就不再需要了。
由于this 在箭头函数中已经按照是否作用域绑定了,所以,用call() 或者apply() 调用箭头函数时,无法对this 进行
绑定,即传入的第一个参数被忽略。
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(生成器)是ES6标准引入的新型数据类型。一个generator看上去像一个函数,但可以返回多次。
function* foo(x){
yield x +1;
yieldx + 2;
return x +3;
}
generator 和函数不同的是,generator由function* 定义(注意多出的*号),并且,除了return 语句,还可以用yield 返回多次。
函数只能返回一次,所以碧玺返回一个Array. 但是,如果换成generator,就可以一次返回一个数,不断返回多次。
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;
}
直接调用试试:
fib(5); // fib {[[GeneratorStatus]]: "suspended", [[GeneratorReceiver]]: Window}
直接调用一个generator和调用函数不一样,fib(5)仅仅是创建了一个generator对象,还没有去执行它。
调用generator对象有两个方法,一是不断地调用generator对象的next()方法:
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
在JavaScript 中,Date 对象用来表示日期和时间的。
要获取系统当前时间,用:
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是JavaScript Object Notation的缩写,它是一种数据交换格式。
在JSON中,一共就这么几种数据类型:
1,number: 和JavaScript的 number 完全一致;
2,boolean: 就是JavaScript的 true或 false;
3,String: 就是JavaScript的String ;
4,null: 就是JavaScript的null;
5,array: 就是JavaScript 的Array 表示方式——[];
6,object: 就是JavaScript 的{...} 表示方式。
SON还定死了字符集必须是UTF-8,表示多语言就没有问题了。为了统一解析,JSON的字符串规定必须用双引号"",Object的键也必须用双引号""。
序列化
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"]}'
结果:
{
"name": "小明",
"age": 14,
"gender": true,
"height": 1.65,
"grade": null,
"middle-school": "\"W3C\" Middle School",
"skills": [
"JavaScript",
"Java",
"Python",
"Lisp"
]
}
第二个参数用于控制如何筛选对象的键值,如果我们只想输出指定的属性,可以传入Array:
JSON.stringify(xiaoming, ['name', 'skills'], ' ');
结果:
{
"name": "guagua",
"skills": [
"JavaScript",
"Java",
"Python",
"Lisp"
]
}
还可以传入一个函数,这样对象的每个键值对都会被函数先处理:
function convert(key, value) {
if (typeof value === 'string') {
return value.toUpperCase();
}
return value;
}
JSON.stringify(guagua, convert, ' ');
上面的代码把所有属性值都变成大写:
{
"name": "guagua",
"age": 14,
"gender": true,
"height": 1.65,
"grade": null,
"middle-school": "\"W3C\" MIDDLE SCHOOL",
"skills": [
"JAVASCRIPT",
"JAVA",
"PYTHON",
"LISP"
]
}
如果我们还想要精确控制如何序列化小明,可以给xiaoming定义一个toJSON()的方法,直接返回JSON应该序列化的数据:
反序列化
拿到一个JSON格式的字符串,我们直接用JSON.parse() 把它变成一个JavaScript 对象:
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}
JavaScript 基础(七) 箭头函数 generator Date JSON的更多相关文章
- JavaScript中的箭头函数
1.定义 箭头函数相当于匿名函数,并且简化了函数定义.箭头函数有两种格式,一种像上面的,只包含一个表达式,连{ ... }和return都省略掉了.还有一种可以包含多条语句,这时候就不能省略{ ... ...
- javascript 使用 匿名 箭头函数 this的变化
处理html 页面 <body> <div class="main"> <div class="up"> <div c ...
- JavaScript基础精华02(函数声明,arguments对象,匿名函数,JS面向对象基础)
函数声明 JavaScript中声明函数的方式:(无需声明返回值类型) function add(i1, i2) { return i1 + i2;//如果不写return返回 ...
- Javascript基础三(函数)
函数第一节: 1.函数的概念及作用 函数是由事件驱动的或者当他被调用时可执行的可重复使用的代码块. 具备一点功能的代码段,代码段来实现具体的功能.要想实现一个函数的功能需要对函数进行调用. ...
- JavaScript基础学习(六)—函数
一.函数的定义 1.function语句形式 //1.function语句式 function test1(){ alert("I am test1"); } test1(); 2 ...
- JavaScript基础知识(函数)
函数的基础 函数: 把实现相同功能的代码放到一个函数体中,当想实现这个功能时,直接执行这个函数即可:减少了的冗余:高内聚,低耦合--> 函数的封装: 函数:引用数据类型: var a = 10; ...
- javascript基础之回调函数
简单来说,回调函数:也就是将要执行的函数. 回调函数具体的定义为:函数A作为参数(函数引用)传递到另一个函数B中,并且这个函数B执行函数A.我们就说函数A叫做回调函数.如果没有名称(函数表达式),就叫 ...
- JavaScript中的普通函数和箭头函数
最近被问到了一个问题: javaScript 中的箭头函数 ( => ) 和普通函数 ( function ) 有什么区别? 我当时想的就是:这个问题很简单啊~(flag),然后做出了错误的回答 ...
- JavaScript基础,Cookies,Sessions
php和JavaScript,掌握JavaScript基础,自定义函数,流程控制语句,事件,调用JavaScript脚本,在PHP中使用JavaScript. JavaScript是网景公司开发的,是 ...
随机推荐
- pytho day6 <正则表达式、常用模块、反射>
本节介绍: 一:正则表达式: 正则表达并不是python 独有的.在各个语言里都有该语法的介绍.正则表达是处理字符串的强大的处理工具.拥有自己的独特的 处理方法.和处理引擎.虽然性能没有python ...
- Linux下部署solrCloud
1. 准备工作 这里我只是把我的师兄教我的关于Solrcloud搭建的过程,以及需要注意的地方文档化了.感谢他教会了我很多. 1.机子IP 三台安装linux系统的机子的IP地址为: 172.24.1 ...
- C#的输入、输出与运算符、数据类型
(1)Visual Studio.NET起始页 启动Visual Studio.NET后,首先看到一个如下图所示的起始页.在起始页可以打开已有的项目或建立新的项目. (2)新建Visual1C# .n ...
- Codeforces Round #156 (Div. 2)
A. Greg's Workout 模3求和,算最大值. B. Code Parsing 最后左半部分为x,右半部分为y,那么从中间不断去掉xy,直到其中一种全部消去. C. Almost Arith ...
- CF 600B Queries about less or equal elements --- 二分查找
CF 600B 题目大意:给定n,m,数组a(n个数),数组b(m个数),对每一个数组b中的元素,求数组a中小于等于数组该元素的个数. 解题思路:对数组a进行排序,然后对每一个元素b[i],在数组a中 ...
- C语言实现的Web服务器(转-kungstriving)
自己研究了好几天终于写出来一个,哈哈,当然也从网上得到了很多的帮助拉.谢谢大家咯!这个版本还不是很完善,但Web服务器的基本框架已经出来了,还有部分的功能需要进行进一步的测试和修改.虽然说C的开发比较 ...
- JavaBean基本用法示例(一)
一.首先创建一个类person,里面有四个成员:name,sex,age,info,添加四个成员所有的set和get方法. package com.kaly.bean; public class pe ...
- Openvas 使用
最新版的kali没有安装,配好源,就可以安装. 一. 简介: Nessus是其中一个最流行的和有强力的漏洞扫描器,尤其是对UNIX系统.它最初是自由和开放源码,但他们在2005年关闭了源代码,在200 ...
- mybatis 小于号 转义
AND lbaq.watch_answer_start_datetime >= #{stm}AND lbaq.watch_answer_end_datetime <= #{etm} 此时报 ...
- 复制到剪贴板的JS实现--ZeroClipboard (兼解决IE下兼容问题)
复制到剪贴板的JS实现--ZeroClipboard (兼解决IE下兼容问题) 相信绝大多数人都遇到过这样的功能实现,“复制”或者“复制到剪贴板”这样的功能.但是由于各大浏览器的实现方案不一样,导致几 ...