前端——js基础
一、JavaScript （简称js）——js可以给网页实现一个动态效果
1.JavaScript 组成
- 核心语法 ECMScipt 简称(es): 规范js的基本语法
1.es是js的语法规范 管理者
2.js是es的实现 操作者
- DOM => 文档对象 提供js操作 (例如: 通过js来获取页面中某个元素)
- BOM => 浏览器对象模型 英文全称: Browser Object Model 提供一系列 操作浏览器的方法
2.js书写位置
- 内部js写法: 直接写在html里面 要使用script标签包裹
- 外部js写法: 新建一个js文件 通过script里面 src属性 引入
注意：js书写规范:
1.严格区分大小写
2.标点字符 半角输入法 使用英文标点符号
3.严格缩进 (换行 空格 对齐) 维护好代码的可观性和可读性
4.js语句在结束 加分号结尾 (;)
5.命名多用驼峰命名 见名知意
示例——html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<!-- 外部js写法 通过script 的src属性 引入 js文件 -->
<script src='./index.js'></script>
</head>
<body>
<!-- js内部写法 通常放置在 body结束标签前面 -->
<script>
// script标签内 只能写js代码
// 两个斜杠 js单行注释 快捷键:ctrl+/
/* js多行注释 */
// 输出内容方式 (在js里 你要输出的文本内容都需要放到引号里面)
// 方法1: 弹框输出内容
alert('你好啊');
// 方法2: 控制台输出方法
console.log('你好');
</script>
</body>
</html>
3.变量
1. 变量用途是什么——存储数据
声明变量 才能使用
通过关键字来声明 let是新版本 用来声明变量的关键字
2. let和const声明的变量区别是：
let: 变量可以先声明 后赋值 可以重复给变量名赋值
const: 声明必须赋值 不能重复赋值 不变的量
3. 什么是常量？
不变的量 声明必须赋值 不能重复赋值
示例1
<script>
// 声明一个变量 这个变量名叫 wx
let wx;
// console.log(wx);
//undefined 相当于 初始值 就是还没给这个变量 进行赋值
// 把无限好帅 存储到 变量名为 wx 通过等号赋值(=)
wx = '无限好帅';
// 通过console.log方法 打印 wx的值
console.log(wx);
// 声明变量 并且赋值 常用
let str = '想吃烧烤';
console.log(str);
let a = 123;
// 打印一个大写A则会报错 js严格区分大小写
console.log(a);
</script>
示例2
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
// 1. 声明变量 并且赋值 常规写法
let num = 1;
console.log(num);
// 2.声明变量 暂时不赋值
let box;
console.log(box);// 默认值: undefined 初始值 未定义的值
// 3.声明 先运算 在赋值
let a=1;
// a =1
let b=2;
// b=2
let sum=a+b;
// 先执行 右边运算 sum= 1+2 在赋值 sum =3
console.log(sum);
// 4.重复声明 会报错
// let str='我的宝贝';
// let str='亲爱的';
// console.log(str);
// 5. 一次性 声明多个变量名 用逗号隔开
let box1='盒子',wrap='写个内容',text='看看你是什么文本';
console.log(box1,wrap,text);
// 6. 省略 let 直接赋值 调用 解析器 会帮我们 隐式声明 变量
sex ='男'
console.log(sex);
// 不写let 不利于表达意图
// 7. 声明变量 给这个变量名 重复赋值 后面会覆盖前面
let str;
str=10;
str=20;
console.log(str);// 20
// const 声明变量方法 声明常量 而非普通变量 比如π等
const str1='处对象';
console.log(str1);
// 重新给 str1赋值
// str1='搞什么咯,好好学习';
// console.log(str1); // 报错 不能修改 常量的值
// const声明常量 不会改变的量 声明那就必须赋值 不赋值就报错
// const cpdd;
// console.log(cpdd);
</script>
</body>
</html>效果：
