1、什么是 JavaScript？

　　JavaScript 是一门跨平台、面向对象的动态的弱类型的轻量级解释型语言，是一种基于对象和事件驱动并具有相对安全性的客户端脚本语言。应用于 HTML 文档能够在网站上提供动态的交互能力，他不同于 Java。简单说就是基于浏览器处理 HTML 文档，实现各种网页特效，响应用户的各种操作，为网页添加动态效果，提升用户操作体验，比如图片滚动播放效果，点击登录按钮弹出对话框，鼠标移入移出动画，表单提交数据验证等。

2、为什么要学习 JavaScript？

　　JavaScript 通常被称为 JS，他发明的目的，就是作为浏览器的内置脚本语言，为网页开发者提供操控浏览器的能力，他可以让网页呈现出各种特殊效果，为用户提供友好的互动体验。随着 Ajax 技术的出现，前端可以在不刷新页面的情况下和后端进行数据交换，更新页面数据，jQuery 等库的盛行让 JS 编写变得异常简单，Bootstrap 框架更让前端的成本无限降低，大大提高了前端开发的效率，JS 在前端领域前景非常广阔。

　　随着 Node 的发布，使得 JS 不仅可以运行在前端，还可以运行在服务器上。这对 JS 来说是一次质的突破，Node.js 项目使得 JS 可以用于开发服务器端的大型项目，网站的前后端都用 JS 开发已经称为了现实。

　　至此 JS 除了可以被浏览器解析，也可以作为后端语言使用，越来越多的应用程序，将 JS 作为内嵌的脚本语言，可以用来构建移动端 APP，开发 HTML 游戏，可以不依赖于浏览器，构建桌面应用程序。

　　可以预期，最终只使用 JS 这一种语言，就可以开发出适应不同平台（包括桌面端，服务器端，手持端）的程序。在 Jeef Atwood 发布的博客中，他提出了著名的“Atwood定律”，即“任何能够用 JavaScript 实现的应用程序，最终都必将用 JavaScript 实现”。

　　相比学习其他语言，JS 很容易学习。只要有浏览器，就能运行 JS 程序，只要有文本编辑器，就可以编写 JS 代码。不用安装复杂的 IED（集成开发环境）和编译器。JS 的语法相对简单一些，本身的语法不是特别多，而且语言灵活，完全可以只用简单的命令，完成大部分的操作。

　　虽然 JS 的核心语法不难学习，但是要真正学透还不是一件容易的事，JS 其实是很复杂的，随着学习，越能体会到他的强大。JS 要发挥作用，必须与其他组件配合，这些外部组件五花八门，而且数量庞大，涉及到了网络应用的各个方面，比如编辑器组件，QQ 空间提供的关注组件等，要掌握他们并非易事，必须下狠功夫。JS 语言有一些设计缺陷，在一些地方会出现怪异的运行结果，各主流浏览器对于 JS 的支持不尽相同，兼容性是最让人头疼的事情，学习 JS，很大一部分时间都是用来搞清除哪些地方有陷阱。

　　尽管如此，JS 的地位还是不可动摇的，2015年公布的世界语言使用排名，JS 排在第七位，较去年又有了提升。Ecma（通过 Ecma-262 制定脚本语言的标准）加快了语言的标准化，使得 JS 功能日益增强，而语法缺陷和怪异之处也得到了弥补，截至今年 JS 最新版本为 ECMAScript 2015，也叫 ES6，增加了许多新特性。所以，JS 还是值得学习的，不仅要掌握，而且要学精，尤其对于 Web 前端开发工程师尤为重要。

3、JavaScript 组成

　　JS 由三部分组成：

　　ECMAScript：也叫解释器，充当翻译角色，这是 JS 的核心部分。

　　DOM：文档对象模型（Document Object Model）。DOM 赋予了 JS 操作 HTML 的能力，即 document 操作。

　　BOM：浏览器对象模型（Browser Object Model）。BOM 赋予了 JS 操作浏览器的能力，即 window 操作。

4、JavaScript 用法

　　HTML 中的脚本必须位于 <script></script> 标签之间。可以在 HTML 文档中放入不限数量的脚本。脚本可位于 HTML 的 <head>或<body> 中，或者同时存在于这两个部分中。通常的做法是把函数放在 <head> 中，或者放在页面底部，这样不会干扰页面的内容。

　　也可以把脚本保存在外部文件中，文件扩展名为 .js，外部文件通常包含被多个网页使用的代码。注意：在使用外部脚本时，脚本内不能包含 <script> 标签。

5、编写 JavaScript 的流程

　　首先，也是最重要的，先要搞清楚网页效果的实现原理，要达到什么目的，需要对哪些属性做出修改，以及用户的哪些操作，通过用户的某种操作，一步步的构思 JS 实现的方法。

　　然后 HTML+CSS 布局页面。

　　接着选择需要修改的属性的名称（id 或 class）。

　　再根据用户的操作，选择相应的触发事件。

　　最后，在事件中，根据第一步的构思，编写 JS 代码。

　　

　　

　　

JavaScript学习总结【1】、初识JS的更多相关文章

  1. 高性能javascript学习笔记系列(1) -js的加载和执行

    这篇笔记的内容主要涉及js的脚本位置,如何加载js脚本和脚本文件执行的问题,按照自己的理解结合高性能JavaScript整理出来的 javascript是解释性代码,解释性代码需要经历转化成计算机指令 ...

  2. JavaScript学习日志：关于js分号

    javascript有自动添加分号的功能,但是不是所有情况都会自动添加,要区分: 1,如果语句独占一行 如果当前行内的语句能够被js正确解析,那么就会在句尾添加一个分号. (如何判断是否正确解析?你在 ...

  3. JavaScript基础知识（初识JS）

    js的组成部分 1. ECMAScript : JS的基础语法 变量 数据类型,操作语句,函数 es3 es5 es6; 2.DOM : document object model : 文档对象模型: ...

  4. 前端学习(十）初识js（笔记）

    js事件(公有属性) onclick=""  当点击...时! onmouseover="" 当鼠标移入...时!onmouseout="" ...

  5. javascript学习笔记(四) Number 数字类型

    数字格式化方法toFixed().toExponential().toPrecision(),三个方法都四舍五入 toFixed() 方法指定小数位个数  toExponential() 方法 用科学 ...

  6. JavaScript学习12 JS中定义对象的几种方式

    JavaScript学习12 JS中定义对象的几种方式 JavaScript中没有类的概念,只有对象. 在JavaScript中定义对象可以采用以下几种方式: 1.基于已有对象扩充其属性和方法 2.工 ...

  7. JavaScript学习10 JS数据类型、强制类型转换和对象属性

    JavaScript学习10 JS数据类型.强制类型转换和对象属性 JavaScript数据类型 JavaScript中有五种原始数据类型:Undefined.Null.Boolean.Number以 ...

  8. JavaScript学习06 JS事件对象

    JavaScript学习06 JS事件对象 事件对象:当事件发生时,浏览器自动建立该对象,并包含该事件的类型.鼠标坐标等. 事件对象的属性:格式:event.属性. 一些说明: event代表事件的状 ...

  9. JavaScript学习03 JS函数

    JavaScript学习03 JS函数 函数就是包裹在花括号中的代码块,前面使用了关键词function: function functionName() { 这里是要执行的代码 } 函数参数 函数的 ...

随机推荐

  1. HDU 4635 多校第四场 1004 强联通

    我还有什么好说,还有什么好说...... 我是SBSBSBSBSBSBSBSBSBSBSBSBBSBSBSBSBSBSBSBSBS........................ 题意 思路什么的都不 ...

  2. Navicat远程连接MySQL数据库

    1.打开Navicat,在界面的“主机名和IP地址”处输入IP地址,一般是192.168.1.1 2.输入相应的用户名和密码,点击连接测试,确认是否已经连接,之后就可以点击确定了 3.找到相应的数据库 ...

  3. 使用js实现html锚功能，可以任意定位锚的位置，比锚更加灵活

    今天记录一个js功能,发现该功能很实用,拿出来跟大家分享. 这里我使用js的window.scrollTo()函数,该函数的用法给大家重复一下,语法为scrollTo(x,y),这里x表示在窗口文档显 ...

  4. ServletContext和ServletConfig

    一.ServletConfig对象 1 .作用 ServletConfig对象: 主要是用于加载servlet的初始化参数. 在一个web应用可以存在多个ServletConfig对象(一个Servl ...

  5. java获得项目绝对路径

    在jsp和class文件中调用的相对路径不同. 在jsp里,根目录是WebRoot 在class文件中,根目录是WebRoot/WEB-INF/classes 当然你也可以用System.getPro ...

  6. <s:form action="login"...与<s:form action = "login.action".的区别

    1.<s:form action="login" namespace="/login"> 它表示的是<form id="login& ...

  7. NuGet的使用和服务搭建

    问题的由来 最近部门,在开发的时候遇到一个问题,现在有项目A B C三个项目,项目B和C分别提供了组件库由项目A直接引用.那么每次开打项目A获取最新后,同时还得打开项目B C获取最新然后编译一次.抛开 ...

  8. Xcode 5 安装coco2d-iphone

    从http://www.cocos2d-iphone.org/download/下载并解压缩最新版本的cocos2d,默认情况下会保存在 /Users/XXX/Downloads/cocos2d-ip ...

  9. Linux学习笔记总结--CentOS 设置静态IP

    1.修改网卡配置 vi /etc/sysconfig/network-scripts/ifcfg-eth0 DEVICE=eth0 #描述网卡对应的设备别名,例如ifcfg-eth0的文件中它为eth ...

  10. magic_quotes_runtime（魔术引号开关）

    我们可以通过以下代码来探测php环境中magic_quotes_runtime是否开启: magic_runtime.php 源代码如下: <?php //当magic_quotes_runti ...