《JavaScript 模式》读书笔记(1)— 简介
哇,看了自己最近的一篇文章,已经刚好一年来,其实那时候刚刚接触Jest,啥也不会(虽然现在其实也一样不会,嘿嘿),就想记录下工作中遇到的一些问题。但是后来在持续的工作中才发现,那两篇文章写的其实是很有一些问题的。希望不会给大家带来误导,在某些特殊的情况下,确实可以解决描述中的问题,但是实际上,并没有真正的理解问题是什么,只是片面的解决罢了。
时隔一年,最近想要提升下自己的js功底,提升下自己在更高层次的方向上的一些思路和能力,所以看了这本书。其中有些内容一方面由于我的能力较差,妈的竟然没看懂,一方面因为是翻译的,所以总觉得怪怪的。好吧,跟我之前的理由一模一样。
当然,这很长的一段时间,虽然没写博客,但是也抄了不少东西,比如《css世界》,比如深入学习了一下vue,等等等等。再比如之前的一段时间,真的忙的不行,懒得要死。
我工作到今天差不多刚好三年半的时间,感觉自己的水平,也不过一直在模仿,从未被超越。也不知何时(感觉整个工作生涯都没戏了)能有一点真正的自己的看法和见解。也算我没有白白的干了前端好几年。
在正文开始之前,我想说的是,我写的内容,全都是抄的。说实话我真的没想到会有几千的阅读量,在未来和以后,也希望我自己可以写出来更细腻和认真的内容,而不是为了写而写(其实我主要是觉得自己记不住,想要看的时候这样比较方便)。
啰嗦了这么多,那么开始真正的内容吧。
其中所涉及到的内容包括基本技巧,比如变量提升,循环,类型转换,命名约定等。后面包括字面量,函数,对象,代码复用(继承),设计模式,DOM和浏览器模式等核心内容。并且在每一个内容下会详细介绍及细分规划。
说实话,我看了一遍,但是觉得其中内容深厚且重要,是每一个进阶前端开发都必须学会,学懂的知识。故,有此系列博文。
以下是真正的正文:哈哈。
What is 模式?
广义上的模式是指“重现事件或者对象的主题,……它是一个可以用来产生其他事物的模版或者模型”。在软件开发过程中,模式是指一个通用问题的解决方案。一个模式不仅仅是一个可以用来复制粘贴的代码解决方案,更多地是提供了一个更好的实践经验、有用的抽象化表示和解决一类问题的模板。
学习和识别模式,是非常重要的,理由如下:
1. 通过学习模式,可以帮助我们使用经过实践证明有效的经验来编写代码,而不是去做很多无用功。
2. 模式提供了某种程度上的抽象。大脑在一定的时间内,仅能记住一定数量的内容,因此思考更复杂的问题时,使用模式可以让您集中精力去用已有的模式来解决该问题,而不需要被一些低层次的细节所困扰。
3. 模式,可以改善开发者和开发团队之间的交流,通常开发者是采取远程交流而不是面对面进行交流。为一些编码技术或方法贴上标签并命名,可以很方便地确保双方能够了解对方确切表达的意思。
本系列内容,核心讨论以下三种类型的模式,即:设计模式,编码模式以及反模式。尤其要说明的是反模式。反模式并不是一个bug,或者是编码错误,它仅仅是常见的、引发的问题比解决的问题更多的一种方法。
Javascript基础概念
面向对象
我们经常会聊到面向对象,所以,在这里,我们就把什么是面向对象,到底怎么面向对象开发,来搞一个清楚。
JavaScript语言有一个特性,即万物皆对象,你看到的任何一段JavaScript代码,都很有可能是一个对象。只有五种基本类型不是对象:数值类型、字符串类型、布尔类型、空类型和未定义类型。其中前三个类型有对应的以基本类型封装形式体现的的对象表示(后面会详细介绍)。数值类型、字符串类型的值可以通过程序员或者位于幕后的JavaScript解析器来实现向对象的转换。
函数实际上也是对象,函数有属性和方法。
任何一门语言中最简单的事情就是定义一个变量。在JavaScript中,一旦定义好了变量,同时也就已经正在处理对象了。首先,该对象会自动成为内置对象的一个属性,成为激活对象(如果该变量是一个全局变量,那么该变量会成为全局对象的一个属性)。第二,该变量实际上也是伪类(这里我理解为,未通过“显式”的方法,比如构造函数,生成(或继承)的具有属性的一个对象),该属性决定了该变量是否可以被修改、被删除和在一个for-in循环中枚举(可以通过Object.getOwnPropertyDescriptor来查看
)。
那么对象到底是什么呢?其实对象仅仅是一个容器,该容器包含了命名的属性,键值对(大多数)的列表。这里面的属性可以是函数(函数对象),这种情形下我们称其未为方法。
关于创建的对象的另外一件事情是可以在任意时间修改该对象(尽管ECMAScript引入了API来防止突变)。可以对一个对象执行添加、删除和更新它的成员变量。
最后,需要记住的是对象主要有两种类型:原生的(Native,如ECMAScript标准),主机的(Host即宿主的,比如浏览器环境)。另外,原生对象可以进一步分为内置对象(例如数组,日期对象等)和用户自定义对象(如var o = {})等。主机对象包含Windows对象和所有的DOM对象。
没有类
在JavaScript中没有类,我们只处理对象。尽量多使用对象的组合,而不是使用类的继承。这句话的意思是通过已有的对象组合来获取新对象,是比通过很长的父 – 子继承链来创建新的对象更好的一方法。
原型
JavaScript没有继承,尽管这是重用代码的一种方式。可以使用多种方法来实现继承,这里通常使用原型。原型是一个对象,并且创建的每一个都会自动获取一个Prototypes属性,该属性指向一个新的空对象。该对象几乎等同于采用对象字面量或Object()创建的对象,区别在于他的constructor属性指向了所创建的函数,而不是指向内置的Object()函数。可以为该空对象增加成员变量,以后其他对象也可以从该对象继承并像使用自己的属性一样使用该对象的属性。
要记住,每一个函数都有prototype属性,每一个对象都有一个__proto__属性。(先带着疑问,后面的文章会详细解答。)
简单的介绍之后,我又想起了最开始聊过的问题。到底什么是面向对象?到底如何面向对象开发(编程)?
首先要说的是,面向对象与面向对象编程即OOP(Object Oriented Programming)是两回事,个人理解,面向对象是一种描述,我们应该使用怎样的手段去做一件事,而面向对象编程,则是一种方法,也就是说,我们使用面向对象的手段或方法,去进行开发。另外的,还有函数式编程,那我个人理解,函数式编程也是一种方法,我们使用函数式的方法、方式去编程,编写代码。
那么面向对象是什么呢?其实我的理解,就是在一切的编程“沟通”中数据流转的执行方式,我们通过对象的方式,去进行数据的传递及流转,那什么是“对象的方式”,即:类与实例,而js中没有类的概念,那么就要使用到原型。所以,在js中发挥原型的能力,使用原型的能力去编程,就可以大概的理解为是面向对象的编程(当然,要知道,这实际上是很片面的理解)。
希望我的理解没有出现方向性的错误,后面,会详细的介绍原型以及继承的内容。