JavaScript电子书
给大家带来的一篇关于JavaScript相关的电子书资源,介绍了关于JavaScript、ES6、函数式编程方面的内容,本书是由清华大学出版社出版,格式为PDF,资源大小46.3 MB,Anto编写,目前豆瓣、亚马逊、当当、京东等电子书综合评分为:9.7分
JavaScript ES6函数式编程入门经典电子书封面
非常不错的一本书,不到200页,言简意赅,可以领略函数式编程,初试函数式编程,强烈推荐。
全书共129页,第四章在60页json对象的java代码实现没有写,测试代码跑不通。
用了一段时间js,看看专业人士是怎么用的。言简意赅,有些代码需要多理解下。
比较基础,看完加练习2天时间足够,对函数式编程入门的同学很友好
《JavaScriptES6函数式编程入门经典》使用JavaScriptES6带你学习函数式编程。你将学习柯里化、偏函数、高阶函数以及Monad等概念。
目前,编程语言已经将焦点从对象转移到函数。JavaScript支持函数式编程,并允许开发者编写精心设计的代码。
主要内容
●掌握函数式编程的概念
●清楚函数在JavaScript中的地位
●理解真实的函数式类库,并创建一个模拟underscore.js的函数式类库
●实践纯错误处理技术,例如函子和Monad
●了解ES6的函数式编程特性,例如扩展运算符和Generator
JavaScript ES6常用基础知识总结
ES6 let与const及其相关
块级作用域
ES6新增了块级作用域,总结一句话大致就是:大括号{}包起来的代码块基本山都可以当做块级作用域。
常见的有
直接使用{}包起来:
{ var a = 4 }
函数体大括号,if-else大括号,for循环大括号,switch大括号,try-catch大括号等。 需要注意的是,for循环,每一次循环时的{}都是一个独立的块级作用域。
for(let i=0; a < 5; i++){ let j = i }
上面代码循环了五次,实际上有五个独立的j。
日常开发中,我们就可以利用这个特性,来创建块级作用域了。
块级作用域变量let与const
使用let或const声明的变量只在当前块级作用域生效,出了这个代码块,就无法访问。
{ let a = 5 } console.log(a) // Uncaught ReferenceError: a is not defined
日常开发中,块级作用域中使用的变量,尽量使用let或者const声明。
需要注意的问题:
let和const变量一定要先声明,再使用,避免出错。不要试图利用变量提升的特性。
const声明变量时,一定要初始化,否则会报错。let建议也在声明时初始化。
const声明的变量一旦初始化,以后就不可以在进行赋值操作,但可以对其引用的对象进行更改。
const noChangeMe; // Uncaught SyntaxError: Missing initializer in const declaration const noChangeMe = [1,2,4] noChangeMe = [2, 3] // Uncaught TypeError: Assignment to constant variable noChangeMe[100] = 100 // everything is OK
let和const声明的变量不能再重复声明。 虽然var可以无限次重复声明,但是并不适用于这两个新的声明方式。
let a = 1 let a = 2 // Identifier 'a' has already been declared
不要用window.xxx去调用let与const声明的变量 ES6规定,let、const、class声明的全局变量,不属于顶层对象的属性。
String
使用反引号”`”
使用``将字符串包起来,可以解决下面的问题:
字符串不能换行,如果换行只能使用+号
字符串中的引号如果和最外层相同,需要进行转义
字符串中插入变量,需要用+号 以前这样的写法:
var name = 'world' var str = "小明说:\"hello, " + name + "\"" // 小明说:"hello, world"
现在可以方便的写作:
var name = 'world' str str = `小明说:"hello, ${name}"`
总的来说,有三个好处:
不怕字符串中出现的引号;
不怕换行,反引号包起来的字符串可以随便换行;
使用${}将变量或表达式包起来直接放在字符串中,不用写很多+
ES6 遍历字符串
使用for...of代替for循环:
var string = 'string' for(var i of string) { console.log(i) }
includes(),startsWidth(),endsWidth()
不用使用indexOf()判断字符串中是否包含某个值了,使用includes():
var string = 'string' string.includes('i', 0) // true
includes第二个参数表示查找的起始索引。 还可以使用startsWidth()和endsWidth()判断字符串是否以某些字符开始或结尾。
ES6 函数
参数的默认值
方便地设置函数参数的默认值
function print( a = 2 ){ console.log(a) } print() //2
ES6 扩展运算符…获取其余参数
可以使用...加上变量名保存其他参数全部数量。 当只知道函数的前几个具体参数,不确定之后会有多少个参数传入时,可以使用...把其他传入的参数保存到一个数组中。
function print(value1, value2, ...values){ console.log(values.join('--')) } print(1, 2, '参数3') // 参数3 print(1, 2, '参数3', '参数4', '参数5') // print(1, 2, '参数3', '参数4', '参数5')
ES6 使用箭头函数
使用箭头函数有两个好处:
代码更加简洁
静态绑定this 箭头函数中,this指向的是定义箭头函数的对象中的this。
var name = 'outer' var obj = { name: 'inner', func: () => { console.log(this.name) } } var obj2 = { name: 'inner', func: function() { console.log(this.name) } } obj.func() // "outer" obj2.func() // "inner"
第一个使用了箭头函数,由于箭头函数的this与其所在环境中的this相同,也就是与obj的this相同,而obj处于全局环境的活动对象中,this指向全局对象,这里指window,所以输出outer。 注意:obj对象的this与它的属性中的this不一样。 第二个使用了寻常函数,作为obj2的一个属性,func方法中的this指向了所在的对象。输出inner。
ES6 数组
使用Array.from()把类数组对象转为数组
一般来说,含有length属性的对象就可以当作类数组对象。平时获取多个DOM对象后,不能使用数组中的很多方法。我们可以使用Array.from方便的转换为数组,。
var divs = Array.from(document.querySelectorAll('div')) divs.forEach((value, index) => {})
使用fill()初始化数组
想要以某个值初始化数组,需要遍历。而使用fill()方法,就方便了很多。
var arr = new Array(100) // 建立一个100元素的数组 arr.fill('初始值', 0, arr.length)
第一个参数是要填充的值,后面两个与一般的数组方法一样,起始索引和结束索引(不包括)。
使用includes方法
和字符串的includes方法一样,看数组中是否有给定值。
对象
使用简单的属性表示和方法表示
var name = 'John' var a = { name: name, sayName: function(){ console.log(this.name) } }
改写为:
var name = 'John' var a = { name, sayName () { console.log(this.name) } }
记得Object.is()这个方法
其与===的差别:
NaN === NaN // false Object.is(NaN, NaN) // true -0 === +0 //true Object.is(+0, -0) // false Object.is(+0, 0) / true Object.is(-0, 0) / false
可以这样理解,遵循的原则: 是同一个东西就要相等。 NaN与NaN就是一个东西,而-0带了个负号,和0与+0不一样。0和+0相同就像1和+1相同一样。
使用Object.assign()合并多个对象
Object.assign()是用来合并对象的。assign,译作分配,指派。这个方法本意是将某些对象自己的属性拷贝到目标对象上。它不回去复制继承来的属性。 比如可以在定义某个配置的时候,定义一个基础配置,在定义两个不同情况下的配置。使用时,进行合并。
var pathConfig = { path: 'style/images' } var devConfig = { baseUrl: 'http://localhost:8080/' } var buildConfig = { baseUrl: 'https://192.128.0.2' } // 使用时,合并 var mode = 'dev' var config = Object.assign({}, pathConfig, mode === 'dev' ? devConfig : buildConfig)
只是举个例子。
Object.keys(),Object.values(),Object.entries
这三个方法返回对象自身的,可枚举的,属性名为字符串的属性相关的东西,分别为:
Object.keys(): 属性名组成的数组 Object.values(): 属性值组成的数组 Object.entries: ["key", "value"]组成的数组。 var john = { name: 'John', age: 12 } Object.keys(john) // ["name", "age"] Object.values(john) // ["John", 12] Object.entries(john) // [["name", "John"], ["age", 12]]
ES6 ...运算符
前面在函数的剩余参数处理中提到了...扩展运算符。总结了一下,感觉有两个用法:
用来读取数组或者对象的时候,是把数组或对象给扩展开;
用来给对象或者数组赋值的时候,自动给对象或数组添加属性或元素。
用来读取
读取的时候就是把数组或者对象给扩展开来。
var a = [...[1,2,3], 4] // 把数组的每一项都展出来 a // [1, 2, 3, 4] var obj = { name: 'John', age: 12 } var newObj = {...obj, job: 'teacher' } // 把某个属性展出来 newObj // {name: "John", age: 12, job: "teacher"}
所以可以很方便的用来扩展,合并数组或对象。
用作赋值
用作赋值的时候,是用作解构赋值,含义就是把等号右边表达式的剩余属性或数组项都放到...后面的变量里。
var a, restB [a, ...restB] = [1, 3, 5] a // 1 restB // [3, 5] var c, restD { name, ...restD } = {name: 'John', age: 12, job: 'teacher'} name // "John" 是一个属性的值 restD // { c, ...restD } = {name: 'John', age: 12, job: 'teacher'} 是一个对象
对于对象的解构赋值,会把对应不到的属性全部放进...后面的变量对象中。
注意:因为是把剩下没人要的属性或者数组项都收下,所以...应该放在数组或者对象中的最后,且只能有一个。
以上即是ES6常用基础知识总结,希望对大家有所帮助
以上就是本次介绍的JavaScript电子书的全部相关内容,希望我们整理的资源能够帮助到大家,感谢大家对码农之家的支持。
下一篇:大数据基础编程、实验和案例教程
展开 +
收起 -
本书由资深软件开发专家撰写,凝聚其多年开发经验,系统、深入、全面地阐释JavaScript,内容涉及流行的Web开发实践,结合实际案例进行讲解,授人以渔。本书内容并不局限于某个具体功能的
立即下载这本书针对JavaScript 中的核心技术,结合前沿开发实践,全面的讲解与分析JavaScript 的内存、函数、执行上下文、面向对象、模块等重点知识
立即下载这是由jQuery库创始人编写的一本深入剖析JavaScript语言的书,从不同层次讲述了逐步成为JavaScript高手所需的知识,适合具备一定JavaScript基础知识的读者阅读
立即下载目录 * 核心例子* 修改成静态变量(const)或块级变量(let) * 开始修改 * 疑问解释(重复定义会发生什么) * 疑问解释(let的块级作用域是怎样的) * 疑问解释(const定义的变量在基础数据类型和引用类型中的差异)* 修改成Promise的形式 * 预备知识(回调函数是什么) * 预备知识(如何把回调函数改为Promise) * 开始修改* 修改成箭头函数(Arrow Function) * 预备知识(箭头函数是什么) * 预备知识(箭头函数函数中的this是个坑) * 开始修改* 修改拼接字符串成模板字符串 * 预备知识(字符串的拼接方式) * 预备知识(改为模板字符串的方式) * 开始修改* 修改成解构的对象* 修改成Class 核心例子 文中的例……
ES6 let与const及其相关 块级作用域 ES6新增了块级作用域,总结一句话大致就是:大括号{}包起来的代码块基本山都可以当做块级作用域。 常见的有 直接使用{}包起来: { var a = 4 } 函数体大括号,if-else大括号,for循环大括号,switch大括号,try-catch大括号等。 需要注意的是,for循环,每一次循环时的{}都是一个独立的块级作用域。 for(let i=0; a 5; i++){ let j = i } 上面代码循环了五次,实际上有五个独立的j。 日常开发中,我们就可以利用这个特性,来创建块级作用域了。 块级作用域变量let与const 使用let或const声明的变量只在当前块级作用域生效,出了这个代码块,就无法访问。 { let a = 5 }console.log(a) // Uncaught ……
在JS中,函数是一等公民。这该怎么理解?为什么说它是“一等”的呢?其实这体现在函数可以去任何值可以去的地方,很少有限制。 函数可以存储为变量 函数可以存储为数组元素 函数可以成为对象的成员变量 函数可以在使用时直接创建出来 函数可以传递给另一个函数 函数可以被另一个函数返回 最后两点其实就是高阶函数的定义,一个高阶函数可以执行以下至少一项操作:以一个函数作为参数、返回一个函数作为结果。
读了前三章,了解了基础的函数式编程的知识,今年读书的目的是学到想学的知识,没必要全读完也可以标记为“读过”,当然,即使读完,也未必能全消化。以后有机会再多读几章吧
什么是函数是编程 函数式编程技术主要基于 数学函数和它的思想 数学中的函数有什么特点? 如f(X)=Y: 函数必须总是接收一个参数 函数必须总是返回一个值 函数应该依据接收到的参数,而不是外部环境运行
Copyright 2018-2021 www.xz577.com 码农之家
版权投诉 / 书籍推广 / 赞助:520161757@qq.com
详解Javascript ES6中的箭头函数(Arrow Functions)
ES6可以使用“箭头”(=)定义函数,注意是函数,不要使用这种方式定义类(构造器)。 一、语法 1. 具有一个参数的简单函数 var single = a = asingle('hello, world') // 'hello, world' 2. 没有参数的需要用在箭头前加上小括号 var log = () = { alert('no param')} 3. 多个参数需要用到小括号,参数间逗号间隔,例如两个数字相加 var add = (a, b) = a + badd(3, 8) // 11 4. 函数体多条语句需要用到大括号 var add = (a, b) = { if (typeof a == 'number' typeof b == 'number') { return a + b } else { return 0 }} 5. 返回对象时需要用小括号包起来,因为大括号被占用解释为代码块了 var getHash = arr = { // ... return ({ name: 'Jack', age: 33 })} 6. 直接作为事件handler document.addEve……