js学习第一篇：初识JavaScript

三、初识JavaScript

3.1JavaScript历史

• 布兰登.艾奇10天内完成的设计

• 网景公司最初命名为LiveScript，之后与sun公司合作改名为javascript

3.2JavaScript是什么

3.2.1概念

JavaScript是运行在客户端的脚本语言（Script是脚本）

3.2.2脚本语言-解释性语言

是指不需要编译，运行过程中由js解释器（js引擎）来进行解释并执行。

3.3JavaScript的作用

（1）表单动态校验--最初的作用

检测密码强度，使其在前台就可以进行判断，减轻后台服务器

（2）网页特效

轮播图，下拉菜单等等动态效果

（3）服务端开发（Node.js)

（4）桌面程序

弹出小日历，记事本等等

（5）APP

（6）控制硬件

（7）游戏开发

逐渐发现能做的事情越来越多，所以慢慢爆火。

3.4HTML/CSS/JS的关系

3.4.1描述类语言

HTML/CSS是标记语言-----描述类语言

• HTML决定网页结构和内容（决定看到什么），相当于身体

• CSS决定呈现的模样（决定好不好看），相当于给人穿衣服，化妆

3.4.2编程类语言

JS是脚本语言-----编程类语言

• JS决定业务逻辑和页面控制（决定功能），相当于人的动作

3.5浏览器执行js

浏览器分为两部分 渲染引擎 和 JS引擎

• 渲染引擎：用来解析HTML与CSS，俗称内核

• js引擎：也称JS解析器。读取网页中的JavaScript代码，对其处理后运行。

• 浏览器本身不会执行JS代码，是通过内置的JS引擎来解析的。

• JS被称为脚本语言，脚本语言解析是“逐行解析”，解析一行执行一行。

3.6JS的组成

3.6.1ECSMAScript

ECSMAScript规定了JS的变成语法和基础核心知识，包括JavaScript(网景公司)和Jsscript（微软公司），这两者实际上是对其的实现和扩展。

3.6.2DOM-文档对象模型

DOM是W3C组织推荐的处理可扩展标记语言的标准编程接口。

• 通过DOM提供的接口对元素进行操作（大小，位置，颜色等）

3.6.3BOM-浏览器对象模型

BOM提供独立于内容的，可以和浏览器互动的对象结构。

• 通过BOM可以操作浏览器窗口（弹出框，控制跳转，获取分辨率等）

3.7JS书写位置

3.7.1.行内式

直接写在元素内部

eg:

<input type="button" value="哈哈" οnclick="alert('笑啥呢')">

3.7.2内嵌式

写在html文件的头部

eg:

<script> alert('哈哈') </script>

3.7.3外部式*

将js代码写在xxx.js文件中，再外连js，同时外部式的<script></script>标签之间不可以写代码。

eg:

<script scr="js文件位置"></script>

注意：

HTML中多用双引号，JS中多用单引号

3.8JS的注释

①单行注释

//

②多行注释

/**/ vscode默认快捷键 :ctrl+shift+a

3.9JS的输入输出

3.9.1alter(msg)--警示框

浏览器弹出警示框

3.9.2console.log(msg)--控制台打印

浏览器控制台打印输出信息

3.9.3prompt(info)--输入框

浏览器弹出标题为info的输入框，用户可输入

四、变量

4.1.什么是变量？

一个装数据的“盒子”，通过变量名获取、修改数据

本质：变量是程序在内存中申请的一块用来存放数据的空间

4.2变量的使用

①声明变量

②赋值

4.3变量初始化*

声明+赋值=就是初始化

两种方式：

1️⃣var a = b = c =9;等同于： var a = 9;b = 9; c = 9;

2️⃣**var a=9,b=9,c=9;**等同于 ： var a =9;var b = 9;var c = 9;

4.4语法扩展

①一个变量被重新赋值后，它原有的值就会被覆盖，以最后一次赋值为准。

②声明多个变量，用逗号隔开，最后分号结尾

//原先写法
var name = 88;
    var age = 44;
    var sex = '女';

//如今写法
var name = 99, age =77,sex = '男';

③声明不赋值使用，会显示undefined

④不声明赋值使用，会报错

⑤不声明，直接赋值使用，居然不报错！！

4.5命名规范

①由字母，数字，下划线、美元符号组成，如：user123_$

②不以数字开头，不以关键字，保留字命名

（注意：name这个变量名，默认有含义，即便不声明使用也不报错）

③变量名之间不能有空格

④严格区分大小写

⑤遵循驼峰命名法：首字母小写，其他大写

如：helloMyWorld

⑥变量名要有含义。如：age

推荐翻译网站：有道，爱词霸