快捷键:win+v查看剪切板 ;Ctrl+右箭头 跳过一个单词;Ctrl+回车 换行
一、JavaScript介绍
通常是运行在浏览器的编程语言
可以实现人机交互效果,提供逻辑思维能力
作用:
服务端编程、数据交互(获取后端数据、渲染到前端)、表单验证、网页特效(动画效果)、监听用户行为
(A)组成
(一)ECMAscript(规范|规则)
规定了js基础语法核心知识:语言法律
例如:创建变量、分支语句、循环语句、对象等
(二)Web APIs(网页应用接口 | 可操作的实体对象)
(1)DOM:document object model
文档对象模型
实体化了一个对象叫document,整个HTML页面就是一个文档
(2)BOM:browser object model
操作浏览器
实体化了一个浏览器window对象,整个网页
(B)、JavaScript书写位置
内联(行内样式)、内部、外部
内部样式:应该写在</body>标签上面。(浏览器从上至下逐行解析代码)
因为js可以去控制元素,所以应该写在所有的HTML标签元素之后
外部样式:通过src引入HTML页面中
但是<script>标签不要写内容,会被忽略
(C)、JavaScript注释
1、单行注释
符号://
快捷键:ctrl+/
2、块注释
符号:/* */
(3)、JavaScript结束符
1、结束符
■ 代表语句结束
■ 英文分号 ;
■ 分号可写可不写,要么都写,要么都不写,建议写分号
■ 换行符(回车)会被识别为结束符
(D)、JavaScript输入输出法
alert()和prompt()会阻塞主线程
1、输出方式
■ alert(要弹出的内容);里面不可以写多个
■ document.write("要输出的内容");可以写多个
■ console.log('控制台打印');console控制台.log日志方法,可以写多个
2、输入
■ prompt('提示文字');
二、变量
变量是计算机存储数据的容器(盒子)| 是内存中的地址空间
(A)变量声明方式
1、语法: let关键字 变量名
2、变量赋值:变量名 = 数据
3、变量值的修改:变量名 = 数据
4、声明多个变量:let age = 18,uname = '刘亦菲';中间以逗号隔开
注意:
(1)声明变量的同时可以进行赋值,例如:let age = 18;
(2)变量名不能重复
(3)名词解释:
关键字:系统内部已经定义好的词汇,
字面量:字面上,所见即所得的 一个数据
(B)变量本质
内存:计算机存储数据的地方,相对于一个大空间
变量:是程序在内存中申请的一块用来存数据的小空间(内存中的一个地址空间)
(C)变量名命名规范与规则
1、规则
▲ 不能使用关键字
▲ 特殊字符:_下划线和$
▲ 不能以数字开头
▲ 可以有数字、字母
2、规范
▲ 起名要有意义
▲ 遵循小驼峰命名法
三、数据类型
js数据类型分为两大类:
基本数据类型(简单数据类型),引用数字类型(复杂数字类型)
(一)基本数据类型
1、数字类型number
整数、小数、负数
2、字符串string
单引号' ' 、双引号" " 、反引号 `` (esc键下面)
△ 必须成对使用
△ 单双引号可以互相嵌套使用,前提是必须交替使用
△ 自己嵌套自己时,必须使用转义符号‘\’
△ 反引号中间可以直接用回车的
3、拼接字符串string
语法:字符串+字符串
数据${变量}
模板字符串
4、布尔类型(boolean)
true 真 false 假
用来判断
5、未定义(undefined)
没有初始化,没有开辟内存空间
检测开发场景,通过值是否是undefined来判断传递过来了没
6、null (空类型)
赋值了,初始化了,只是值叫做空
代表empty变量为 空数据
(二)检测数据类型
1、JS是弱数据类型 ,变量到底属于那种类型,只有赋值之后,我们才能确认
JavaScript是强数据类型,例如 int a = 3 必须是整数
02、通过typeof 关键字 来检测变量类型
3、通过控制台颜色看,可以看出数字型和布尔型颜色为蓝色,字符串和undefined颜色为灰色
(三)类型转换
使用表单、prompt获取来的数据默认是字符串类型的
1、隐式转化
系统内部自动的进行类型转化
规则:
1、+ 号两边只要有一个是字符串,都会把另外一个转成字符串;
2、显式转化
//1、Number(数据)
console.log(Number("123"));
// 1.1 当数据不能转化为数字的时候,会返回NaN,not a number
console.log(Number("abc"));
// 1.2 NaN是一个数字类型
console.log(typeof Number("abc"));
// 2、parseInt(数据)
// 作用:解析为 整数
console.log(parseInt("1.23"));
// 3、parseFloat(数据)
// 作用:可以保留小数点
console.log(parseFloat("1.233"));
转换为字符型:
String(数据)、变量.toString(进制)
// 字符串转化
// 1.string(数据)
console.log(String("321"));
console.log(String(123));
console.log(String(true));
console.log(String(undefined));
console.log(String(null));
// 2.变量.toString(进制);进制不写,默认为十进制
// 需要一个变量
// 数字.toString() 会报错,需要变量
let a = 123;
console.log(a.toString());
补充知识:
parseInt() parseFloat()
【parse解析的意思: 只要传入的数据是以数字开头的,就能解析成功,返回值为第一个数字直到碰到非数值为止; 比如 parseInt("123aa") ;返回 123】
Number() : 不能解析,有非数字就返回NaN
四、常见错误
1、Uncaught ReferenceError: age is not defined( age变量没有定义过)
2、Uncaught SyntaxError: Identifier 'age' has already been declared (提示 “age”已经声明)
3、Uncaught SyntaxError: missing ) after argument list (提示 参数少了 ))