作为一名专注并且热爱前端(也好意思说)的“伪前端”,js一直是我心中的痛,说完全不懂吧,也知道点,能写简单的东西,也用过jquery写交互和逻辑以及一些简单动画,说懂吧,不算,随便一个问题都能难倒我,但我不甘如此啊,于是乎,既然新的一年要做出一些实实在在的事情,那么没有什么比把它搞定更实在的了。故而,我会在学习的过程中,把一些笔记、心得,在这里记录下来,起名“征服javascript”,以便自己查看,或者也会对某些看到的朋友有帮助。既然是学习的过程,完整性和准确性就不敢打包票了,所以,如果您发现了什么问题也是正常的。欢迎交流。好了,不废话了,正题:
要学一样东西,首先得有一个大概的认识。
对于js,最直观的认识,莫过于,当我们用html搭好了网站的骨架、用css美化了它,然后呢?似乎还缺少什么,对的,js最初的产生,就是用来控制浏览器和给网页添加活力和交互性的。至于java和长得很像的javascript这哥俩的关系,相信大伙都听过雷峰塔的段子,就不啰嗦了。
javascript可以做什么?
我们可以想象一下,如果没有它,做不了什么,那么就知道它可以做什么了。
交互性,比如对于鼠标的悬停和点击给予一定的响应和反馈,操作页面中的元素;表单验证;控制浏览器窗口;利用自身的日期和时间特性,生成时钟、日历等;设置cookie;即时构建页面或者创建基于web的应用程序等。
说到javascript时,我们经常谈什么
一个完整的js实现,包括:
核心(ECMAScript)、DOM、BOM
ECMAScript
我们常见的web浏览器是ECMAScript实现的宿主环境之一,为什么说之一呢,因为这个,曾让很多人觉得,它只能在浏览器里工作,还有其他的宿主环境比如node(一种服务端js平台)和Adobe Flash。
它规定了这门语言的下列组成部分:
语法、类型、语句、关键字、保留字、操作符、对象
DOM
不得不说的DOM,提供访问和操作网页内容的方法和接口。
当然不只是因为js,很多人印象比较深的可能就是操作DOM,增删查之类的。其实不是,DOM是文档对象模型的英文缩写,跟js没关系,每个网页都有它的DOM结构,也有说法叫DOM树,树上的每个对象可以称为“节点”(node),可以使用js对其进行修改。如果节点包含html标签,称为“元素节点”,否则是文本节点。当然可以推出,元素节点可能包含文本节点。
BOM
浏览器对象模型,它是处理浏览器窗口和框架,人们也习惯把所有针对浏览器的javascript扩展算作BOM的一部分,比如:
- 弹出新浏览器窗口
- 移动、缩放、关闭浏览器窗口
- 提供浏览器详细信息的navigator对象
- 提供浏览器所加载页面详细信息的location对象
- 提供用户显示器分辨率信息的screen对象
- cookie等
语句
即我们通常见到的条件判断语句、循环语句,label语句,with语句等,用来执行一些符合某种逻辑的操作
对象
有人说它是面向对象,有人说那样不严格,应该是基于对象。不管哪种说法,我觉得,对于初学者都没什么影响的,因为,都不知道在说什么…
在说对象的时候,都喜欢拿猫、狗什么的打比方,来解释什么是属性,什么是方法。比如它们有耳朵、鼻子、眼睛等等,这些是属性,会跑、会叫,这些是方法,能够控制这些,就能指挥它做很多事,那,这些跟写程序有什么关联呢?
貌似不知所云,其实不是,我们会获取一个东西,会对它进行操作,会对数据进行处理,这些都可以看做是对象。
属性
比如,如果一个对象是文档,那么它会有标题;一个对象是表单,它可能有文本输入框、单选框等。改变对象的属性就修改了对象本身,相同的属性名可以用于不同的对象,比如,猫有耳朵,狗也有耳朵,人也有耳朵。另外,有些属性本身也可以是对象,对象可以有子对象。
方法
对象可以做的事情,称之为“方法”。
比如,猫会叫,链接、按钮可以点击click()、窗口可以打开open()等。
简单来说,可以把“对象”、“属性”看做名词,方法是“动词”。
对象、属性、方法组合,组合可以更好的描述对象或过程,比如
对象和属性 car.wheel
对象和方法 car.run()
以上写法称为“点号语法”
事件
之前就说过,js是用来处理“行为”和“数据”的,既然有行为,肯定要发生什么,称为“事件”。
js里面有很多的事件处理程序,当用户在网页上进行相应的操作,就会触发它。比如,很常见的“onclick、onload”等,那么是不是所有用户的行为都需要去响应呢,也不是,你需要关心的是哪些事件是你的需求,能有比较好的体验或者应该响应。
值和变量
值:在js中,一段信息就是一个值,比如我们熟悉的“数字、字符串”等。当然还有别的,后续详细记录。
变量:是用来存储值的,学过编程的都知道,都喜欢用一个盒子或一个房子来做比喻,道理都一样。可存,可取,可操作
提示:变量名区分大小写,不能包含空格和其他标点,不能以数字开头,不能是js的保留字。
操作符
简单说来,就是“+、—、*、/”等,当然,还有++、–此类。
需要注意的是,数字和字符串相加,结果是字符串,这个也是有规律可循,后面遇到再详述。
赋值和比较
赋值:将一个值放入到一个变量,就是赋值,使用赋值操作符完成,例如:myName=”idea”;
除了=,还有“+=、-=、*=、/=、%=”等。
比较:两个值或者变量可以进行比较,操作符有“==、===、!=、>=”等这些。
上面基本列出了我们说起js时会说到的东西。仅对js进行了一下概览,以后的文章里会对其进行逐个详述。
小结
js是一种专为与网页交互而设计的脚本语言,它为网页开发人员提供了操控网页元素和响应用户行为的方法。最近两年,由于各种框架和node、react等的流行,它似乎变得更加强大,有更大的想象空间和应用场景。
然而,或许因为它的强大,让很多人觉得,掌握了它就很厉害或者它很难学,其实大可不必,戒除浮躁,踏踏实实,一步一个脚印,相信要不了多久就能有不错的进步。
这是我们的第一步,后续会深入学习。一起加油吧!~