初识 JavaScript
文章目录
初识 JavaScript
1.JavaScript 是什么
2 JavaScript的作用
JS初体验
一.引入js文件
二. JavaScript注释
三.单行注释
四. 多行注释
五.输入输出语句
六. 声明变量
1. 赋值
2. 变量的初始化
3. 变量语法扩展
4. 变量命名规范
三. 数字类型
1.数字型 Number
2.字符串型 String
3.字符串转义符
4.字符串长度
5. 字符串拼接
四.获取变量数据类型
五.数据类型转换
1.转换为字符串
2. 转换为数字型
六.常见关键字+保留字
1.关键字：
2.保留字：
1.JavaScript 是什么
- JavaScript 是世界上最流行的语言之一，是一种运行在客户端的脚本语言 （Script 是脚本的意思）
- 脚本语言：不需要编译，运行过程中由 js 解释器( js 引擎）逐行来进行解释并执行
2 JavaScript的作用
- 表单动态校验（密码强度检测） （ JS 产生最初的目的 ）
- 网页特效
- 服务端开发(Node.js)
- 桌面程序(Electron)
- App(Cordova)
- 控制硬件-物联网(Ruff)
- 游戏开发(cocos2d-js)
JS初体验
一.引入js文件
-
行内式
<input type="button" value="点我试试" onclick="alert('Hello World')" />- 可以将单行或少量 JS 代码写在HTML标签的事件属性中（以 on 开头的属性），如：onclick
- 注意单双引号的使用：在HTML中我们推荐使用双引号, JS 中我们推荐使用单引号
- 可读性差， 在html中编写JS大量代码时，不方便阅读；
- 引号易错，引号多层嵌套匹配时，非常容易弄混；
- 特殊情况下使用
-
内嵌式
<script> alert('Hello World~!'); </script>- 可以将多行JS代码写到 script 标签中
-
外部JS文件
<script src="this.js"></script>
二. JavaScript注释
- flex子项目占的份数
- align-self控制子项自己在侧轴的排列方式
- order属性定义子项的排列顺序（前后顺序）
三.单行注释
单行注释的注释方式如下：
// 我是一行注释
// 用来注释单行文字（ == 快捷键 ctrl + / == ）
四. 多行注释
多行注释的注释方式如下：
/*
这个是
多行注释
*/
/* */ 用来注释多行文字（ 默认快捷键== alt + shift + a== ）
五.输入输出语句
| 方法 | 说明 | 归属 |
|---|---|---|
| alert(msg) | 浏览器弹出警示框 | 浏览器 |
| console.log(msg) | 浏览器控制台打印输出信息 | 浏览器 |
| prompt(info) | 浏览器弹出输入框，用户可以输入 | 浏览器 |
注：alert() 主要用来显示消息给用户，console.log() 用来给程序员自己看运行时的消息。
六. 声明变量
// 声明变量
var age;
- var 是一个 JS关键字，用来声明变量( variable 变量的意思 )。
- age 是程序员定义的变量名
1. 赋值
age = 10; // 给 age 这个变量赋值为 10
- = 用来把右边的值赋给左边的变量空间中 此处代表赋值的意思
- 变量值是程序员保存到变量空间里的值
2. 变量的初始化
var age = 2; // 声明变量同时赋值为 2
// 声明一个变量并赋值， 我们称之为变量的初始化。
3. 变量语法扩展
-
更新变量
一个变量被重新复赋值后，它原有的值就会被覆盖，变量值将以最后一次赋的值为准。
var age = 18; age = 81; // 最后的结果就是81因为18 被覆盖掉了 -
同时声明多个变量，只需要写一个 var， 多个变量名之间使用英文逗号隔开。
var age = 10, name = 'zs', sex = 2; -
声明变量特殊情况
| 情况 | 说明 | 结果 |
|---|---|---|
| var age ; console.log (age); | 只声明 不赋值 | undefined |
| console.log(age) | 不声明 不赋值 直接使用 | 报错 |
| age = 10; console.log (age); | 不声明 只赋值 | 10 |
4. 变量命名规范
- 由字母(A-Za-z)、数字(0-9)、下划线(_)、美元符号
( $ )组成，如：usrAge, num01, _name - 严格区分大小写。var app; 和 var App; 是两个变量
- 不能 以数字开头。
- 不能 是关键字、保留字。例如：var、for、while
- 遵守驼峰命名法。首字母小写，后面单词的首字母需要大写。
三. 数字类型
1.数字型 Number
JavaScript 数字类型既可以保存整数，也可以保存小数(浮点数）。
var age = 21; // 整数
var Age = 21.3747; // 小数
1 . 数字型进制
最常见的进制有二进制、八进制、十进制、十六进制。
// 1.八进制数字序列范围：0~7
var num1 = 07; // 对应十进制的7
var num2 = 019; // 对应十进制的19
var num3 = 08; // 对应十进制的8
// 2.十六进制数字序列范围：0~9以及A~F
var num = 0xA;
2 . 数字型三个特殊值
-
Infinity ，代表无穷大，大于任何数值
-
-Infinity ，代表无穷小，小于任何数值
-
NaN ，Not a number，代表一个非数值
3 . isNaN，判断一个变量是否为非数字的类型，返回 true 或者 false。
2.字符串型 String
字符串型可以是引号中的任意文本，其语法为 双引号 “” 和 单引号’’
var strMsg = "周末去郊游"; // 使用双引号表示字符串
var strMsg2 = '周一再去吧！'; // 使用单引号表示字符串
// 常见错误
var strMsg3 = 好的！; // 报错，没使用引号，会被认为是js代码，但js没有这些语法
3.字符串转义符
| 转义符 | 解释说明 |
|---|---|
| \n | 换行符，n 是 newline 的意思 |
| \ \ | 斜杠 \ |
| ’ | ’ 单引号 |
| " | ”双引号 |
| \t | tab 缩进 |
| \b | 空格 ，b 是 blank 的意思 |
4.字符串长度
通过字符串的 length 属性可以获取整个字符串的长度。
var strMsg = "我有多少个字符呢";
alert(strMsg.length);
5. 字符串拼接
-
多个字符串之间可以使用 + 进行拼接，其拼接方式为 字符串 + 任何类型 = 拼接之后的新字符串
-
拼接前会把与字符串相加的任何类型转成字符串，再拼接成一个新的字符串
//1.1 字符串 "相加" alert('hello' + ' ' + 'world'); // hello world //1.2 数值字符串 "相加" alert('100' + '100'); // 100100 //1.3 数值字符串 + 数值 alert('11' + 12); // 1112
布尔型Boolean
布尔类型有两个值：true 和 false ，其中 true 表示真（对），而 false 表示假（错）。
布尔型和数字型相加的时候， true 的值为 1 ，false 的值为 0。
console.log(true + 1); // 2
console.log(false + 1); // 1
四.获取变量数据类型
获取检测变量的数据类型
typeof 可用来获取检测变量的数据类型
var num = 2;
console.log(typeof num) // 结果 number 数字类型
五.数据类型转换
1.转换为字符串
2. 转换为数字型
六.常见关键字+保留字
1.关键字：
是指 JS本身已经使用了的字，不能再用它们充当变量名、方法名。
包括：break、case、catch、continue、default、delete、do、else、finally、for、function、if、in、instanceof、new、return、switch、this、throw、try、typeof、var、void、while、with 等。
2.保留字：
实际上就是预留的“关键字”，意思是现在虽然还不是关键字，但是未来可能会成为关键字，同样不能使用它们当变量名或方法名。
包括：boolean、byte、char、class、const、debugger、double、enum、export、extends、fimal、float、goto、implements、import、int、interface、long、mative、package、private、protected、public、short、static、super、synchronized、throws、transient、volatile 等。
5-4,打卡,尽快入门JS基础,加油,后续持续出学习笔记整理…
之前的HTML+CSS整理笔记可以点击<html+css知识点整理>JS——Day2笔记整理
分享到这
