讲给Android程序员看的前端系列教程(40集免费视频教程+源码)
版权声明
- 本文原创作者：谷哥的小弟
- 作者博客地址：http://blog.csdn.net/lfdfhl
JavaScript概述
绝大部分人头一回看到JavaScript的时候都会觉得JavaScript是Java的一个分支。然而，非也；两者之间并没有多大的关系。JavaScript与Java的关系就像“大熊猫”与“小熊猫"、“雷峰塔”与“雷锋”它们本质上是两种不同的编程语言。其实，在这门语言设计之初Netscape将其命名为LiveScript，之后才改成了现在的名字JavaScript。嗯哼，化解这个小误解之后我们来瞅瞅JavaScript的真正面目。
-
JavaScript是一种广泛应用于浏览器的编程语言；入门容易，功能强大，操作简单，即使是程序设计新手也可以快速地使用JavaScript进行简单的编程。
-
JavaScript可被嵌入到HTML文件中，使网页更好地与用户交互，提升用户体验
-
JavaScript是一种基于对象和事件驱动，并具有安全性能的脚本语言。
概括地讲：JavaScript是一门运行在浏览器的脚本编程语言
JavaScript特性
JavaScript是脚本语言
脚本(Script)简单地说就是一条条的文本命令，按照程序流程执行。常见的脚本语言有 JavaScript、VBScript、Perl、PHP、Python 等，而 C、C++、Java、C#这些语言不属于脚本语 言。它们的区别在于，非脚本语言一般需要编译、链接，生成独立的可执行文件后才能运行；而脚本语言依赖于解释器，只在被调用时自动进行解释或编译。脚本语言缩短了传统语言“编写— 编译—链接—运行”的过程。
脚本语言通常都有简单、易学、易用的特点，语法规则比较松散，使开发人员能够快速完成 程序的编写工作，但其缺点是执行效率不如编译型的语言快。不过，由于计算机的运行速度越来越快，脚本语言的效率问题几乎可以忽略不计。
JavaScript可以跨平台
JavaScript语言不依赖操作系统，仅需要浏览器的支持。目前，几乎所有的浏览器都支持 JavaScript。在移动互联网时代，利用手机等各类移动设备上网的用户越来越多，JavaScript的跨平台性使其在移动端也承担着重要的职责。例如，JavaScript可以搭配CSS3编写响应式的网页，或者将网页模仿成移动APP的交互方式使APP开发和更新的周期变短。JavaScript还可搭配HTML5中的Canvas 技术进行动画和游戏制作。
JavaScript支持面向对象
面向对象是软件开发中的一种重要的编程思想，其优点众多。例如，基于面向对象思想诞生了许多优秀的库和框架，可以使JavaScript开发变得快捷和高效，降低了开发成本。近几年， Web前端开发技术曰益受到重视，除了经典的JavaScript库jQuery又诞生了 Bootstrap、 AngularJS、Vue.js、React、webpack等框架和工具。
JavaScript的组成
JavaScript可大概分成三部分：
-
ECMAScript：JavaScript的语法标准
-
DOM：JavaScript操作网页上元素的API
-
BOM：JavaScript操作浏览器的部分功能的API
JavaScript常见写法
JavaScript有两种常见的写法，分别介绍如下
外链式写法
<!DOCTYPE html>
<!-- 本文作者：谷哥的小弟 -->
<!-- 博客地址：http://blog.csdn.net/lfdfhl -->
<html lang="en">
<head>
<meta charset="utf-8">
<title>JS的写法</title>
<script type="text/javascript" src="test.js">
</script>
</head>
<body>
</body>
</html>
- 将JavaScript相关代码写在.js文件中
- 请以分号";"结束每一行JavaScript代码
- 利用<script></script>的src属性链接.js文件
- 为提高浏览器的解析效率，尽量将多个js文件合并成一个js
内嵌式写法
示例如下：
<html>
<script type="text/javascript">
//此处为JS代码
</script>
</html>
- 将<script></script>置于HTML中
- 在<script></script>标签内写JavaScript的相关代码
- 请以分号";"结束每一行JavaScript代码
在开发中为便于代码的修改和维护推荐大家采用外链式写法书写JavaScript代码。但是，在本教程中为了方便，我更多地采用内嵌式写法。
JavaScript注释
在JavaScript中常用注释方式有：单行注释和多行注释，示例如下：
// 单行注释
/*
多行注释
多行注释
*/
JavaScript入门程序
好了，在对JavaScript有了最朦胧的初步了解之后；按照国际惯例，我们写一个JavaScript的Hello World程序
利用alert( )弹出信息
代码如下：
<!DOCTYPE html>
<!-- 本文作者：谷哥的小弟 -->
<!-- 博客地址：http://blog.csdn.net/lfdfhl -->
<html lang="en">
<head>
<meta charset="utf-8">
<title>Hello World</title>
</head>
<body>
<script type="text/javascript">
alert("Hello World");
</script>
</body>
</html>
运行后，效果如下图所示：
在此，利用alert( )在网页中弹出提示消息。
利用confirm( )显示确认对话框
代码如下：
<!DOCTYPE html>
<!-- 本文作者：谷哥的小弟 -->
<!-- 博客地址：http://blog.csdn.net/lfdfhl -->
<html lang="en">
<head>
<meta charset="utf-8">
<title>Hello World</title>
</head>
<body>
<script type="text/javascript">
confirm("您真的要关闭此网页么？");
</script>
</body>
</html>
运行后，效果如下图所示：
在此，利用confirm( )显示一个带有指定消息和确定及取消按钮的对话框。
利用prompt( )接收用户输入
代码如下：
<!DOCTYPE html>
<!-- 本文作者：谷哥的小弟 -->
<!-- 博客地址：http://blog.csdn.net/lfdfhl -->
<html lang="en">
<head>
<meta charset="utf-8">
<title>Hello World</title>
</head>
<body>
<script type="text/javascript">
prompt("请输入您的会员卡号");
</script>
</body>
</html>
运行后，效果如下图所示：
在此，利用prompt( )接收用户的输入信息。
利用console.log( )输出日志
代码如下：
<!DOCTYPE html>
<!-- 本文作者：谷哥的小弟 -->
<!-- 博客地址：http://blog.csdn.net/lfdfhl -->
<html lang="en">
<head>
<meta charset="utf-8">
<title>Hello World</title>
</head>
<body>
<script type="text/javascript">
console.log("This is log message");
</script>
</body>
</html>
运行后，效果如下图所示：
在此，利用console.log( )输出日志进行代码的调试。
类似地，我们还常用console.dir( )输出对象的所有属性和方法。
利用document.write( )向输出流写信息
代码如下：
<!DOCTYPE html>
<!-- 本文作者：谷哥的小弟 -->
<!-- 博客地址：http://blog.csdn.net/lfdfhl -->
<html lang="en">
<head>
<meta charset="utf-8">
<title>Hello World</title>
</head>
<body>
<script type="text/javascript">
document.write("本文作者：谷哥的小弟 <br> 博客地址：http://blog.csdn.net/lfdfhl");
</script>
</body>
</html>
运行后，效果如下图所示：
在此，利用document.write( )向输出流写信息，输出信息可以是纯文本也可包含HTML标签
转载：https://blog.csdn.net/lfdfhl/article/details/100670978