三、初识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
推荐翻译网站:有道,爱词霸