2022-08-15
JavaScript简介
<!-- 前端三大件 html 超文本标记语言 结构层 也是一门语言 css 层叠样式表 样式层 JavaScript 轻量级弱类型的脚本语言 --> <!-- js三大核心 ES (ECMAScript) js 语法规范 我们要按照指定的语法进行开发 js这门语言就是一个工具 我们使用这个工具 es 也就是我们要按照说明书使用这个工具 BOM browser object model 浏览器对象模型 提供一整套操作浏览器的解决方案 提供一些属性（静）和方法(动态) DOM document object model 提供一整套文档流 相关的属性和方法 -->
JavaScript基础语法
JavaScript代码的书写位置
-
和
css一样，js也可以有多种方式书写在页面上让其生效 -
js也有多种方式书写，分为 行内式， 内嵌式，外链式
js的应用位置
应用位置 行内
-
a标签
<a href="javascript:alert(6666)">点击一下试试</a>
2. 非a标签
得添加一个行为属性 比如 onclick
<div οnclick="alert(8888)">再次点击</div>
应用位置 内联/内嵌
-
内嵌式的 js 代码会在页面打开的时候直接触发
<script>alert(1)</script> <script> alert(2)</script>
注意:
-
script 标签可以放在 head 里面也可以放在 body 里面 建议放在body的最后 以便把前面的都显现出来
-
代码的读取是自上而下的 从第一个一直到最后一个
-
在 html 页面书写一个 script 标签，标签内部书写 js 代码
应用位置 外链
-
外链式 js 代码只要引入了 html 页面，就会在页面打开的时候直接触发
-
新建一个
.js后缀的文件，在文件内书写js代码，把写好的js文件引入html页面
//我是index.js文件
alert('手握日月摘星辰')
<!-- 相对路径 --> <script src="../data/index.js"></script> <!-- 绝对路径 --> <script src="F:\JN-2201\js day\data\index.js"></script>
注意:
-
通过 script 标签的 src 属性，把写好的 js 文件引入页面
-
一个页面可以引入多个 js 文件
js中的注释
单行注释
// 我是一个单行注释
// 下面代码表示在浏览器里面出现一个弹出层
alert('我是一个弹出层')
-
一般就是用来描述下面一行代码的作用
-
可以直接写两个
/，也可以按ctrl + /
多行注释
/*
我是一个多行注释
*/
/*
注释的代码不会执行
alert('我是一个弹出层')
alert('我是一个弹出层')
*/
alert('我是一个弹出层')
-
一般用来写一大段话，或者注释一段代码
-
可以直接写
/**/然后在两个星号中间写注释 -
各个编辑器的快捷键不一样，
vscode是ctrl + shift + a
js的三种打印方式
-
<script>alert(666)</script>
-
这是弹框的打印方式
-
<script> console.log('hello world') </script>
-
这是在控制台打印 在检查中的控制台上可以看
-
<script> document.write('手握日月摘星辰，世间无我这般人') </script>
-
这是直接在网页上显示
js变量
-
变量指的是在程序中保存数据的一个容器
-
变量是计算机内存中存储数据的标识符，根据变量名称可以获取到内存中存储的数据
-
也就是说，我们向内存中存储了一个数据，然后要给这个数据起一个名字，为了是我们以后再次找到他
-
语法：
var 变量名 = 值
定义变量及赋值
// 定义一个变量 var num; // 给一个变量赋值 num = 100; // 定义一个变量的同时给其赋值 var num2 = 200;
注意:
-
一个变量名只能存储一个值
-
当再次给一个变量赋值的时候，前面一次的值就没有了
-
变量名称区分大小写（
JS严格区分大小写）
变量的命名规则和命名规范
-
规则： 必须遵守的，不遵守就是错
-
一个变量名称可以由 数字、字母、英文下划线（_）、美元符号（$） 组成
-
严格区分大小写
-
不能由数字开头
-
不能是 保留字 或者 关键字
-
不要出现空格
-
规范： 建议遵守的（开发者默认），不遵守不会报错
-
变量名尽量有意义（语义化）
-
遵循驼峰命名规则，由多个单词组成的时候，从第二个单词开始首字母大写
-
不要使用中文
数据类型
-
我们通常分为两大类 基本数据类型 和 复杂数据类型
基本数据类型
-
数值类型（number）
-
一切数字都是数值类型（包括二进制，十进制，十六进制等）
-
NaN（not a number），一个非数字
-
-
字符串类型（string）
-
被引号包裹的所有内容（可以是单引号也可以是双引号）
-
-
布尔类型（boolean）
-
只有两个（
true或者false）
-
-
null类型（null）
-
只有一个，就是
null，表示空的意思
-
-
undefined类型（undefined）
-
只有一个，就是
undefined，表示没有值的意思
-
复杂数据类型
-
对象类型（object）
-
函数类型（function）
//基本类型
//数值类型
// 100
// 100.5
// 100e5 科学计数法
// 进制 2进制 8进制 10进制 16进制
//正无穷 Infinity
//负无穷
// NaN not a number
//字符
//'abc'
//"abc"
//布尔类型
//true false 必须全小写
//undefined 未定义
//null 空
//复杂类型 引用类型
//object
//类 数组
//function
//函数 工具
// console.log(10e5) // 10* 10的5次方
//进制
//十进制 0~9
//二进制 0~1 0b
//八进制 0~7 0o
//十六进制 0~9 a~f 0x
// console.log(77) //默认十进制
// console.log(0o77) //告诉js这是八进制 转成十进制以后输出
// console.log(0b10101) //这是二进制 转成十进制以后输出
// console.log(0xabc) //十六进制 转成十进制以后输出
// console.log(999999e100000000) //Infinity 正无穷
// console.log(-99999999e1000000) //-Infinity 负无穷
// console.log('abc'/0) // NaN 非数字
//字符串
// console.log('he"llo" world')
// console.log("hel'lo' world")
// console.log(`haha
//hehe`) //最终会输出两个 这里的回车键原样显示
// var age = 18
// console.log(`我今年${age}岁`)
// 反单引号中 原样显示 换行会原样显示
//可以解析变量 如果解析变量 就要在变量外加上${}
//布尔
// var test1 = true //一定小写
// var test2 = false //必须是全小写
// console.log(test1)
// console.log(test2)
// var test; //仅仅声明 但是没有赋值
// console.log(test) // undefined
//Null 表示空 空就是什么也没有
// var test = null
// console.log(test)
查看数据类型
-
既然已经把数据分开了类型，那么我们就要知道我们存储的数据是一个什么类型的数据
-
使用
typeof关键字来进行判断
//查看数据类型的关键词 //typeof 重点 不是随便两个数据类型就能一起参与运算的 /* number => 数值 string => 字符 boolean => 布尔 undefined => 未定义 */ var test = 0xabc console.log(typeof test) // number 数值 如果返回的是number 代表这是一个数值类型 var haha = 'abc' console.log(typeof haha) // string 字符 var haha1 = true console.log(typeof haha1) // boolean 布尔 var test1; console.log(typeof test1) // undefined undefined var test2 = null; console.log(typeof test2) //object null 是object 的一个特殊类型
386
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
