目录
1.介绍
JavaScript 是一种运行在客户端（浏览器）的编程语言，实现人机交互效果。
❤作用
– 网页特效(监听用户的一些行为让网页作出对应的反馈)
– 表单验证(针对表单数据的合法性进行判断)
– 数据交互(获取后台的数据, 渲染到前端)
– 服务端编程(node.js)
❤JavaScript的组成:
🐱💻ECMAScript:
规定了js基础语法核心知识。
比如：变量、分支语句、循环语句、对象等等
🐱💻Web APIs :
DOM 操作文档，比如对页面元素进行移动、大小、添加删除等操作
BOM 操作浏览器，比如页面弹窗，检测窗口宽度、存储数据到浏览器等等
JavaScript权威网站： https://developer.mozilla.org/zh-CN/docs/Web/JavaScript
1.1引入方式
JavaScript 程序不能独立运行，它需要被嵌入 HTML 中，然后浏览器才能执行 JavaScript 代码。通过 script 标签将 JavaScript 代码引入到 HTML 中，有三种方式：
❤行内JavaScript
<button onclick="alert('第二个努力奋斗')"></button>
❤内部JavaScript
规范：script标签写在</body>上面
<script>
alert('第二个努力奋斗');
</script>
❤外部JavaScript
<script src="./1.努力奋斗.js"></script>1.2JavaScript注释
❤单行注释
符号：//
作用：//右边这一行的代码会被忽略
快捷键：ctrl + /
// 数据类型❤块注释
符号：/* */
作用：在/* 和*/ 之间的所有内容都会被忽略
快捷键：shift + alt + A
/*
数字类型:Number Nan
字符串类型:String
布尔型:Boolean
未定义型:undefined
空类型:null
*/1.3JavaScript结束符
🐱💻英文分号;代表语句结束
💕实际情况： 实际开发中，可写可不写, 浏览器(JavaScript 引擎) 可以自动推断语句的结束位置
💕现状： 在实际开发中，越来越多的人主张，书写JavaScript 代码时省略结束符
💕约定：为了风格统一，结束符要么每句都写，要么每句都不写（按照团队要求.）
1.4JavaScript输入输出语法
1.4.1输出语法
🤷♂️ document.write()显示在body标签中
document.write('javascript 我来了')
🤷♂️alert()警告弹窗
alert('你好JS~')
🤷♂️console.log()控制台输出语法
console.log('它~会魔法吧~');
1.4.2输入语法
🤷♂️prompt()显示提示对话框,提示用户输入
prompt("我是提示弹窗")
1.5字面量
😉在计算机科学中，字面量（literal）是在计算机中描述事/物
如:
数字1000是数字字面量;
'我是严嵩'是字符串字面量;
[]是数组字面量;
{}是对象字面量.
2.变量
2.1变量的含义
😜理解变量是计算机存储数据的“容器”
😍变量就是一个装东西的盒子。
👀变量是计算机中用来存储数据的“容器”.
注意: 变量不是数据本身，它们仅仅是一个用于存储数值的容器。可以理解为是一个个用来装东西的纸箱子。
2.2变量的使用
2.2.1变量的声明
// 声明变量 let 变量名
let age;
let pc2.2.2变量的赋值
// 给变量赋值;
age = 18
pc = 'fy'😆可以声明赋值一起写
let num = 20
let uname = '张三'2.3变量本质
🐱🐉内存：计算机中存储数据的地方，相当于一个空间
💖变量本质：是程序在内存中申请的一块用来存放数据的小空间
2.4变量命名规则与规范
规则：必须遵守，不遵守报错(法律层面)
规范：建议，不遵守不会报错，但不符合业内通识（道德层面）
🤔1. 规则：
不能用关键字
关键字：有特殊含义的字符，JavaScript 内置的一些英语词汇。例如：let、var、if、for等
只能用下划线、字母、数字、$组成，且数字不能开头
字母严格区分大小写，如Age 和age 是不同的变量
😃2. 规范：
起名要有意义
遵守小驼峰命名法
第一个单词首字母小写，后面每个单词首字母大写。例：userName
2.5数组
2.5.1数组声明
// 数组可以一次保存多个数据
// let 变量名=[数据1,数据二,数据三,……]
// 数组按顺序保存,编号从0开始
let arr = ['关羽', '张飞', '马超', '黄忠', '赵云']2.5.2数组基本使用(length)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
// 数组可以一次保存多个数据
// let 变量名=[数据1,数据二,数据三,……]
// 数组按顺序保存,编号从0开始
let arr = ['关羽', '张飞', '马超', '黄忠', '赵云']
// 控制台输出数组
console.log(arr);
// 输出数组的第二个数据,由于数组从零开始计数,所以第二个数据编号为1
document.write(arr[1])
let week = ['周日', `周一`, '周二', '周三', '周四', '周五', '周六']
// 输出周一
console.log(week[1]);
// 输出数据长度
console.log(week.length);
</script>
</body>
</html>3.常量
3.1声明赋值变量
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
// 常量不能修改,是固定的值
// 常量必须声明就赋值
const pi = 3.14
// pi=2
document.write(pi+ "\n")
const op = 'nmsl'
document.write(op)
</script>
</body>
</html>4.数据类型
4.1数据类型介绍
基础数据类型
😃数字类型:Number
包括 NaN ;NaN 是粘性的。任何对NaN 的操作都会返回NaN
🤷♂️字符串类型:String
通过单引号（ ''） 、双引号（ ""）或反引号( ` ) 包裹的数据都叫字符串
模板字符串
语法
`` (反引号)
在英文输入模式下按键盘的tab键上方那个键（1左边那个键）
内容拼接变量时，用${ } 包住变量let str = `大家好,我叫${uname},今年${age}岁了` document.write(str)
🤣布尔型:Boolean
它有两个固定的值true 和false，表示肯定的数据用true（真），表示否定的数据用false（假）。
😎未定义型:undefined
什么情况出现未定义类型？
只声明变量，不赋值的情况下，变量的默认值为undefined，一般很少【直接】为某个变量赋值为undefined。
🎂空类型:null
JavaScript 中的null 仅仅是一个代表“无”、“空”或“值未知”的特殊值
😁null 和undefined 区别：
undefined 表示没有赋值
null 表示赋值了，但是内容为空
引用数据类型
🎁object对象
4.2检测数据类型
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
let v1 = 10
let v2='13'
let v3=false
let v4
let v5= null
console.log(typeof v1);
console.log(typeof v2);
console.log(typeof v3);
console.log(typeof v4);
console.log(typeof v5);
</script>
</body>
</html>❤通过typeof 关键字检测数据类型
typeof 运算符可以返回被检测的数据类型。
它支持两种语法形式：
1. 作为运算符： typeof x （常用的写法）
2. 函数形式： typeof(x)
4.3类型转换
4.3.1隐式转换
🙌某些运算符被执行时，系统内部自动将数据类型进行转换，这种转换称为隐式转换。
规则：
+ 号两边只要有一个是字符串，都会把另外一个转成字符串
除了+以外的算术运算符比如- * / 等都会把数据转成数字类型
小技巧：
+号作为正号解析可以转换成数字型
任何数据和字符串相加结果都是字符串
4.3.2 显式转换
😋转换为数字型
Number(数据)
转成数字类型
如果字符串内容里有非数字，转换失败时结果为NaN（Not a Number）即不是一个数字
NaN也是number类型的数据，代表非数字
parseInt(数据)
只保留整数
parseFloat(数据)
可以保留小数
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
let str ='100.9.9px'
// 提取整数,如果字符串的第一个字符不是数字,则为NaN
console.log(parseInt(str));
// 提取小数,如果字符串的第一个字符不是数字,则为NaN
console.log(parseFloat(str));
</script>
</body>
</html>😀转换为字符型
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
// 💋String()
let v1 = 10
console.log(typeof String(v1));
// 💋 变量名.toString
let v2 = true
console.log(typeof String(v2));
</script>
</body>
</html>😑转换为布尔型
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
// 只要 '' 0 -0 NaN undefined Null 会转为false 其他都是true
// 为第一个参数传递的值将转换为布尔值。如果该值被省略或为0, -0, null, false, NaN,undefined或空字符串 ( "")，则该对象的初始值为false。所有其他值，包括任何对象、空数组 ( []) 或字符串 " false"，都会创建一个初始值为 的对象true。
let v1 = ''
console.log(Boolean(v1));
let v2 = 0
console.log(Boolean(v2));
let v3 = -0
console.log(Boolean(v3));
</script>
</body>
</html>
749
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
