前端——梳理JS的一些重要知识

JavaScript

本文仅对JavaScript的一些重要知识进行概念上的梳理，详细内容请参考JavaScript 教程。

概念

JavaScript (又称ECMAScript ) ：对网页行为进行编程的一门编程语言。

语法

JavaScript 和Java是两种不同的编程语言，但编程语言在语法上都有相通之处，只是格式规范不同，因此可以类比Java来学习JavaScript 的语法。

变量和数据类型

typeof运算符查询存在如下数据类型：

• js基本数据类型：undefined, boolean, number(注意NaN、Infinity和-Infinity), string
• js复杂数据类型：object(注意null), function

与Java相同之处

• 注释格式一样
• 控制语句格式一样（for、while、if、switch）
  等

与Java不同之处

• 输出方式不同
• js声明变量只用关键字var，java要根据数据类型选择相应的关键字
• js声明变量若未赋值则为undefined，java中声明变量后有默认值
• js中** 代表幂运算，java中没有
• js数组–java list，js对象–java map
• 函数定义不同
• js：==值相同，===值和类型相同；java .equal()值相同，==地址相同
  等

使用

js脚本出现位置（相对于HTML文档）

（1）外部脚本：
myScript.js
（2）内部脚本：

head或body内皆可
（3）内联脚本
直接作为一些能触发事件的属性的值，如οnclick=“myscript”
外部脚本和内部脚本中的代码若是函数，“函数名()”作为触发事件的属性的值

js脚本执行方式

（1）外部脚本和内部脚本中是一段js代码，在浏览器加载HTML文档时自动执行。
（2）一些能触发事件的属性的值就是一段js代码，事件触发执行。
（3）外部脚本和内部脚本中是一个js函数，一些能触发事件的属性的值是“函数名()”，事件触发执行。
总之，js脚本的执行主要是事件来触发。

常见事件

事件：发生在HTML元素上的事情。

对象模型

DOM

• HTML DOM (HTML Document Object Model) HTML文档对象模型： JavaScript 与HTML文档的交互模型。可以实现在页面加载时或加载后改变HTML文档的内容。
• 网页被加载时，创建网页的HTML文档会被浏览器结构化为对象树。
• 根对象是document。

BOM

• BOM (Browser Object Model) 浏览器对象模型： JavaScript 与浏览器的交互模型。
• window 对象代表浏览器的窗口。
• 所有全局 JavaScript 对象，函数和变量自动成为 window 对象的成员。全局变量是 window 对象的属性，全局函数是 window 对象的方法。
• HTML DOM的document也是window对象的属性。

AJAX

• AJAX (Asynchronous JavaScript And XML) 异步JavaScript和XML：JavaScript和服务器的交互模型。
• AJAX名称具有误导性，实际上AJAX 可以通过纯文本、XML文本或JSON文本实现数据传输。
• XML (Extensible Markup Language) 可扩展标记语言：用来传输和存储数据，现多用作配置文件
• JSON (JavaScript Object Notation) JavaScript 对象标记法：用来传输和存储数据
• 在数据传输上JSON相对于XML的优点：
  （1）无需复杂的解析和转译，并且易于理解
  （2）JavaScript 提供內建函数可以将JSON字符串与JS对象进行相互转换

JS库

jQuery

• jQuery 由 John Resig 于 2006 年创建。它旨在处理浏览器不兼容性并简化 HTML DOM 操作、事件处理、动画和 Ajax。十多年来，jQuery 一直是世界上最受欢迎的 JavaScript 库。
• 在 JavaScript Version 5（2009）之后，大多数 jQuery 实用程序都可以通过几行标准 JavaScript 来解决。