JavaScript_01 快速入门概念&语法

JavaScript 最初被称为 LiveScript，由 Netscape（Netscape Communications Corporation，网景通信公司）公司的布兰登·艾奇（Brendan Eich）在 1995 年开发（这哥们在两周之内设计出了JavaScript语言。你没看错，这哥们只用了10天时间。）。在 Netscape 与 Sun（一家互联网公司，全称为“Sun Microsystems”，现已被甲骨文公司收购）合作之后将其更名为了 JavaScript。

图：布兰登·艾奇，JavaScript 创始人

之所以将 LiveScript 更名为 JavaScript，是因为 JavaScript 是受 Java 的启发而设计的，因此在语法上它们有很多相似之处，JavaScript 中的许多命名规范也都借鉴自 Java，还有一个原因就是为了营销，蹭 Java 的热度。

同一时期，微软和 Nombas（一家名为 Nombas 的公司）也分别开发了 JScript 和 ScriptEase 两种脚本语言，与 JavaScript 形成了三足鼎立之势。它们之间没有统一的标准，不能互用。为了解决这一问题，1997 年，在 ECMA（欧洲计算机制造商协会）的协调下，Netscape、Sun、微软、Borland（一家软件公司）组成了工作组，并以 JavaScript 为基础制定了 ECMA-262 标准（ECMAScript）。

第二年，ISO/IEC（国际标准化组织及国际电工委员会）也采用了 ECMAScript 作为标准（即 ISO/IEC-16262）。

JavaScript与ECMAScript的关系：ECMAScript和JavaScript的关系是，前者是后者的规格，后者是前者的一种实现。在日常场合，这两个词是可以互换的。

1.3 JavaScript的组成

1.ECMAScript：也就是JavaScript的基础语法

2.DOM：全称叫做Document Object Model（页面文档模型）可以通过DOM提供的接口对页面上的各种元素进行操作（大小，位置，颜色等），这里不去具体谈论DOM，在JavaScript基础语法学完后再去学习

3.BOM：全称Browser Object Model(浏览器对象模型) 可以与浏览器窗口进行互动的对象结构可以操作浏览器窗口，例如：弹出框，控制浏览器跳转，获取分配率等，这里也是在基础学习完成后再进行BOM学习，由此可见JavaScript基础语法的重要性。

1.4 JavaScript的书写方式

1.4.0 引号拓展问题

在JavaScript中括号里面的内容加引号时，可以用双引号，也可以使用单引号（当然，嵌套除外），而在HTML中括号里采用双引号，所以在JavaScript里面推荐使用单引号，以便将二者进行区分。

1.4.1 行内

在HTML页面中的</body>标签里去写代码如下（示例）：

            <input type="button" value="shaka" onclick="alert('helloworld')">

1.4.2 内嵌（也叫做标签引用）

在HTML的页面去书写script标签,然后在标签里输入内容代码如下（示例）：

                            <script type="text/javascript">
                                alert('helloworld');
                            </script>

1.4.3外部（也叫做文件引用）

建立一个.js文件，在.js文件里面输入内容,这里命名为one.js 代码如下（示例）：

                                     one.js
                                    alert('helloworld');

然后在HTML界面中将其引入代码如下（示例）

         <script src="one.js" type="text/javascript" charset="utf-8"></script>

1.5 JavaScript注释

所谓注释，就是解释代码内容（不参与程序的运行）

在js中，有两种注释方法

1.单行注释：// 快捷键为ctrl + / 代码如下（示例）：

                            <script type="text/javascript">
                            //单行注释
                            </script>

2.多行注释： /* */ 快捷键为shift + alt +a 代码如下（示例）：

                            <script type="text/javascript">
                                /*
                            多行注释
                                */
                             </script>

1.6 JavaScript常用的输入输出语句

1.6.1 浏览器弹出警示框

浏览器弹出警示框，在上面用的就是这个，是可以直观展示给用户的代码如下（示例）：

                            <script type="text/javascript">
                            alert('helloworld');
                            </script>

1.6.2 控制台打印输出信息

输出在控制台上的，给我们程序员自己看的代码如下（示例）：

                            <script type="text/javascript">
                            console.log('控制台输出信息')
                            </script>

1.6.3 浏览器页面输出

向浏览器页面中输出文本，类似于HTML 代码如下（示例）：

                            <script type="text/javascript">
                            document.write('helloworld')
                            </script>

1.6.4 输入框输入

浏览器弹出一个输入框，用户可以输入内容代码如下（示例）

                            <script type="text/javascript">
                            prompt("请输入一个数字");
                            </script>
<-------------------------------------------------------------------------------------->
//输入消息对话框(具体示例)
                           prompt("提示信息","输入框的默认信息");
                           prompt("请输入姓名","张三");
                           prompt("请输入姓名");
//对输入的信息进行捕捉：
                           var a=prompt("请输入","0");
                           var b=prompt("请输入","0");
                           var c=a+b;   //注意，这里的+是连接符
                           alert(c);
                           prompt()得到的数据类型是字符串，+变成了连接符。

1.6.5 确认框语句

浏览器弹出一个确认输入框，确认true,取消false（示例）

//弹出确认框,确认得到true,取消是false
	                    	var flag =confirm("我很帅！");
//可以通过true|false来进行条件筛选
		                    if(flag===true){
		                	alert("嗯,可以！");
		                    }else{
		            	    alert("那肯定是超级帅咯！");
		                        }

二、JavaScript基础语法（ECMAScript）

1.变量

1.1 什么是变量

本质：变量的本质是程序在内存中申请一块用来存放数据的空间这个本质可能小白们听不太懂，用白话来说就是：我们需要存入数据，而这个数据需要一个容器来存放它，也就是说，变量就是用来存放数据的容器

1.2 变量是用来做什么的

上面说到了，变量是用来存数据的，它可以存入我们程序员写的代码内容，同时它也可以存入用户输入的内容，变量这个概念非常非常重要，以后可以说是，哪里都得用这个东西！很重要哦！

1.3 变量的写法以及初始化

变量的声明：需要一个关键字var来声明变量代码如下（示例）：

                            <script type="text/javascript">
                            var name = '张三';//用var关键词来声明一个变量 name
                            </script>

1.5 变量的命名规范

（1）由字母，数字，下划线(_)，美元符号（$）组成

（2）不能以数字开头（3）严格区分大小写

（4）不能是关键字，保留字例如：var 、while、for等等（这个关键字和保留字在csdn可以查到全的，我这里就不再总结了）

（5）变量名最好有意义（能看懂），比如 name，age这种单词，或者是str等，方便观看

（6）驼峰命名法：首字母小写，后面单词首字母大写，例如：myFirstName

2.数据类型

2.1 为什么需要数据类型

在计算机中，不同数据所需占用的存储空间不同，便于把数据分成所需内存大小不同的数据，充分利用存储空间，所以有了数据类型。

2.2 变量的数据类型

基本数据类型（值类型）：String 字符串、Number 数值、Boolean 布尔值、Null 空值、Undefined 未定义。

引用数据类型（引用类型）：Object( 对象,函数，数组）。

2.3 typeof(); 获取数据类型

                             <script type="text/javascript">
                                    var num = 10;
                             console.log(typeof(num))
                             </script>

2.4 typeof(x) 返回x的数据类型：

undefined 未定义，变量被声明后，未被赋值
boolean true和false
string 用单引号或双引号来声明的字符串
number 整数或浮点数
object javascript中的对象、数组和null

3 运算符

3.1 什么是运算符

运算符（operator）：用来实现赋值，比较和执行运算功能的符号

3.2 运算符的分类

算数运算符：加（+）减（-）乘（*）除（/），以及一个很重要的取余（%）++，--

比较运算符：==，===，>,<,<=,>=

逻辑运算符：&&，||

赋值运算符：=，+=，-=，....

3.8 运算符优先级

从高到低排序

小括号：（）

一元运算符：++，- -，！

算数运算符：先* / %，后+ -

关系运算符：> ,>=,<,<=

相等运算符：= =，！=，= = =，！==

逻辑运算符：先&& 后||

赋值运算符： =

逗号运算符：，

3.9 运算符注意事项：

//只做运算，不做取整
                        alert(10/3);   //结果：3.33333335
                        alert(parseInt(10/3));   //结果：取整数部分：3

4 JavaScript流程控制（条件语句）

4.1 什么是流程控制

流程控制的本质：在一个程序执行的过程中，各条代码的执行顺序对程序的结果是有直接影响的，很多时候我们要通过控制代码的执行顺序来实现我们要完成的功能即：控制我们的代码按照一定的结构顺序来执行流程控制，也就是我们常说的条件表达式总的分为三种

if表达式 swith表达式三元表达式

4.2 条件语句并不是循环

4.3 if条件语句

if（条件表达式）{ //执行语句 }else{ }

4.4 三元表达式

条件表达式？表达式1 ：表达式2

4.5 swith条件语句

swith（条件表达式）{ case value1：执行语句1； break； case value2；执行语句2； break； … default；执行最后的语句； } （如果不使用break结束，自动执行后面所有的执行语句，除非遇到break）

5 循环

5.1 什么是循环

循环就是我们看到的，例如：for，while这种的就是循环那么，循环是用来做什么的呢：在实际问题中，有许多具有规律性的重复操作， 因此在程序中要完成这类操作需要执行某些语句，即循环

5.2 JavaScript中常见三种类型循环

for循环（最重点，最常用）
while循环
do…while循环

5.3 for循环

for（初始化变量；条件表达式；操作表达式）{ //循环体 }

5.4 while循环

while（条件表达式）{ //循环体 }

5.5 do while循环

do{ //循环体 }while（条件表达式）

5.6 continue关键字

continue关键字用于立即跳出本次循环，继续下一次循环

5.7 break关键字

break关键字跟continue关键字的区别是：break关键字用于跳出整个循环，就不继续执行了

三、JavaScript事件

£轻描～淡写°

关注

1
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
JavaScript_01 快速入门概念&语法

目录一、JavaScript导读1.1 什么是JavaScript1.2 JavaScript的起源（即历史）1.3 JavaScript的组成1.4 JavaScript的书写方式1.4.0 引号拓展问题1.4.1 行内1.4.2 内嵌（也叫做标签引用）1.4.3外部（也叫做文件引用）1.5 JavaScript注释1.6 JavaScript常用的输入输出语句1.6.1 浏览器弹出警示框1.6.2 控制台打印输出信息1.6.3 浏览........
复制链接

扫一扫