JavaScript是什么
- 运行在客户端的脚本语言
- 脚本语言:不需要编译,运行过程中由js解释器(js引擎)逐行进行解释并执行
- 现在也可以基于Node.js技术进行服务器端编程
常见应用
- 表单动态校验
- 网页特效
- 服务端开发(Node.js)
- 桌面程序(Electron)
- App(Cordova)
- 控制硬件-物联网(Ruff)
- 游戏开发(cocos2d-js)
与HTML/CSS/JS的关系
HTML决定网页结构和内容
CSS决定网页呈现给用户的模样
JS实现业务逻辑和页面控制
浏览器执行JS简介
浏览器分成两部分:渲染引擎和JS引擎
- 渲染引擎:用来解析HTML与CSS,俗称内核
- JS引擎: 也称为JS解释器。用来读取网页中的JavaScript代码,对其处理后运行
JS的组成
ECMAScript
ECMAScript是由ECMA国际(原欧洲计算机制造协会)进行标准化的一门编程语言,这种语言在万维网上应用广泛,它被称为JavaScript或JScript,但实际上后两者都市ECMAScript语言的实现和扩展
DOM-文档对象模型
文档对象模型(Document Object Model,简称DOM),是W3C组织推荐的吹可扩展标记语言的标准编程接口。通过DOM提供的接口可以对页面上的各种元素进行操作(大小,位置,颜色等)。
BOM - 浏览器对象模型
BOM(Browser Obect Model,简称BOM)是指浏览器对象模型,它提供了独立于内容的、可以与浏览器窗口进行互动的对象结构。通过BOM可以操作浏览器窗口,比如弹出框、控制浏览器跳转、获取分辨率等。
JS初体验
输入输出语句
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script>
//这是一个输入框
prompt("请输入你的年龄");
//alert 弹出警示框 输出的 展示给用户的
alert('继续写');
//console控制台输出
console.log('程序员');
</script>
</head>
<body>
</body>
</html>
变量
变量是用于存放数据的盒子
本质
变量是程序在内存中申请一块存储数据的空间
使用
- 声明变量
var是一个JS关键字,用来声明变量(variable)。使用该关键字声明变量后,计算机会自动为变量分配内存空间,不需要程序员管
var age;
- 给变量赋值
age = 10;
- 直接初始化变量
var myName = 'JS';
变量使用示例
接收输入的数据并以弹窗的形式显示
<script>
//用一个变量接收输入框的数据
var myAge = prompt('请输入你的年龄');
//把接收到的数据以弹窗的形式输出
alert(myAge);
</script>
变量语法扩展
- 更新变量
一个变量被重新赋值后,它原有的值就会被覆盖,变量值将以最后一次赋的值为准。 - 声明多个变量
同时声明多个变量时,只需要写一个var,多个变量名之间使用英文逗号隔开。 - 声明变量的特殊情况
- 只声明不赋值,结果时undefined
- 不声明不赋值 ,直接使用变量,编译报错
- 不声明直接赋值使用,可以正常使用(但不建议)
<script>
//1.更新变量
var age = 100;
console.log(age);//100
age = 18;
console.log(age);//18
//2.声明多个变量
var name = '张三' ,
sex = '男',
work = '程序员';
console.log(name,sex,work);
//3.变量的特殊情况
var time;
console.log(time);
console.log(tel);
kk = 100;
console.log(kk);
</script>
由于JS是逐行编译的,前面报错,后面就不运行了
注释掉报错的输出
// var time;
// console.log(time);
// console.log(tel);
变量的命名规范
- 由字母(A-Za-z)、数字(0-9)、下划线(-)、美元符号($)组成
- 严格区分大小写,var app和var APP 是不一样的
- 不能以数字开头
- 不能是关键字,保留字
- 变量名必须有意义
- 遵守驼峰命名法(首字母小写,后面单词的首字母大写)