javascript 的来历，为什么需要javascript？

image

当时人们都是用一个叫Netscape的浏览器来上网的，然后网速也非常的慢，下载一个网页要半天，然后我们的主人公，Brendan Eich在Netscape上注册用户的时候，点击提交按钮之后，过了38秒，然后服务器返回消息：”对不起，您忘了选择性别了“。Brendan Eich几乎要崩溃：”靠，怎么能够这样！这么简单的问题浏览器怎么不直接告诉我，还得让我把数据交到几千公里外的服务器网站，然后在那里检查才能发现问题吗？“

他就觉得浏览器改革势在必行！

Brendan Eich本来就是Netscape的员工，所以他对他的老板说：“这个浏览器不行呀，他无法与用户交互呀，体验非常差”。老板说：“我也有这样的想法，那这个工作就交给你了吧。但是现在我们用什么语言来实现呢？”正巧，这个时候，Sun公司把Oak语言改名为JAVA，并宣称这个语言可以“一次编写，到处运行”(write once, run anywhere)，它看起来很有可能是未来的主宰。

然后网景公司觉得这个语言很不错，于是将java以applet(小程序)的形式运行在浏览器中，然后呢，网景公司的人也都非常喜欢java，所以Sun公司和网景公司关系很好，最后网景公司就决定，这个网页的脚本语言呀，必须和java类似，但是要比java简单，因为要使得非专业的人员也能快速上手，然后Brendan Eich就是创作这个语言的负责人，但是Brendan Eich 对java没有什么兴趣，他对当时的函数式编程语言Scheme更加感兴趣，所以他也是为了完成公司给的任务，仅仅用了10天，就把这个语言给弄出来了。它的名字就叫javascript。把这个名字拆开来看，就是java+script，也就是java版的脚本语言，同时它借鉴了java的数据类型和内存管理机制。然后呢，因为Brendan Eich喜欢函数式编程，所以javascript借鉴了函数式编程的思想，将函数提升到了一等公民的位置。最后呢，javascript就是一个简化版的面向对象编程和一个简化版的函数式编程的结合体。这个就是javascript的来历。

有了javascript之后，我们能干什么？

就像我们之前讲的故事那样，一些简单的逻辑判断，可以不用交给服务器了，我们直接用javascript就可以判断了，速度会快很多，然后我们也可以通过javascript操控HTML，DOM和浏览器。最能提升浏览器体验的东西，就是后来发明的XMLHttpRequest，因为之前javascript虽然可以控制网页，但是不能和服务器通信，如果想要更新一个网页，需要整个网页都需要刷新一遍，哪怕是仅仅一段文字的区别，有了XMLHttpRequest之后，javascript只需要向服务器的接口发出请求，然后等待服务器的响应，然后再做出相应的处理，更新页面什么的，而不需要再刷新整个页面了，就是这么一个小小的功能，让浏览器的体验好了很多，慢慢的，很多桌面的应用都可以在浏览器上实现了。

javascript常用函数

说了这么久历史，我还是讲讲大家更加关心的问题，我们收集到的反馈是大家对于javascript 的常用方法和语法不太熟悉，所以我就跟大家讲讲javascript的一些常用方法和语法吧，这两个我结合在一起，并给大家演示。

javascript的内置对象有：

• Array

• Boolean

• Date

• Error

• Function

• JSON

• Math

• Number

• Object

• RegExp

• String

• Map

• Set

• WeakMap

• WeakSet

当然还有一些不常见的对象，大家可以自行去MDN的网站上看，其实我今天讲的内容大家也都可以在MDN上看，我们先看看我们的数组有哪些属性和方法。

Array对象:

属性

• length

Array方法：

静态方法：

• from()

  • 从一个类似数组(String)或可迭代对象(Map,Set,Arguments参数)中创建一个新的数组实例

• isArray()

• of()

  • 就是修改了array.length属性

实例方法：

• concat()

  • 返回的是浅拷贝的数组，也就是说如果数组中有对象引用，那么新的数组的引用和原来数组的引用是同一个，改变新数组的对象，也会改变原来数组的对象。

• copyWithin() 改变原数组

• entries() 返回一个新的Array迭代器

• every()

• some()

• fill()

• find()/findIndex()

• flatten()

• flatMap()

• forEach()

• filter() 不改变原数组

• map() 返回一个新数组

• reduce()

• reduceRight()

• reverse()

• includes()

• indexOf()/lastIndexOf()

• join()

• keys() 返回一个Array迭代器

• pop()

• push()

• shift()

• unshift()

• slice() 浅拷贝

• sort() 改变原数组

• splice() 这个可以用来插入、删除元素

• toLocaleString()

• toString() 作为字符串操作的时候，调用的这个方法。

像forEach(),map(),reduce(),find(),filter(),every(),some()这些方法，可以配合箭头函数一起使用，写起来非常的优雅。

Object对象

静态方法

• assign()

• create()

• defineProperties()

• defineProperty()

• entries() keys() values()

• freeze()

• is()

Math对象

所有方法和属性都是静态的

属性

• E 自然对数

• PI

静态方法

• abs()

• acos()

• acosh()

• asin()

• asinh()

• ceil()

• floor()

• round()

• random()

• ......

String对象

属性

• length

静态方法

• fromCharCode()

• fromCodePoint()

• concat() 不如使用 + 性能更好

• endsWith()

• startsWith()

• includes()

• indexOf()

• lastIndexOf()

• match() 正则表达式

• padEnd() 填充字符串

• padStart()

• repeat()

• replace() 可用正则表达式

• search() 正则表达式匹配

• slice()

• substring()

• substr()

• split()

• toUpperCase()

• toLowerCase()

• toLocaleLowerCase()

• toLocaleUpperCase()

• trim()

• trimLeft()

• trimRight()

常用表达式

• 解构赋值 (entries, 交换值, 对象)

• 拓展运算符

函数

• arguments 对象(类数组对象，可迭代对象)

• 箭头函数

• 默认参数

• 剩余参数

什么是可迭代对象?

内部定义了@@iterator(Symbol.iterator)属性的对象，比如一些内置对象（String,Array,Map,Set）这些都是可迭代对象，所以我们可以用for...of...循环，同时可以也可以使用拓展运算符...。