关于JavaScript first day

怪癖

已于 2022-12-21 20:13:00 修改

阅读量109

点赞数 3

文章标签： javascript 前端 html vscode 开发语言

于 2022-12-21 20:07:48 首次发布

本文链接：https://blog.csdn.net/2203_75957379/article/details/128400941

版权

一、JS三大重要组成部分

DOM	BOM	ECMAScript
文档对象模型 document object model	浏览器对象模型 browser object model	JavaScript 语法
一个.html就是要一个文档一个文档有很多标签	通过js操作浏览器获取自己想要的内容	ES13
通过js 去添加删除修改标签属性及标签内容		ES5 ES6 ES7

二、JS三种引入方式

行内（a标签）	行内（非a标签）	内联内嵌	外链
在href 属性上进行书写	<div οnclick="alert('hello world')">点我点我</div>	<script> alert(123); alert('hello world'); alert("44944"); </script>	1. 把js代码单独写到一个 .js后缀的文件中 2. 在html中引入这个.js文件
<a href="javascript:alert(内容)"></a> javascript 全小写	1. 需要用户去触发 2. 在标签上增加一个on前缀的属性 on 在什么至上 click 点击 => onclick	1. 需要在head 或者body中加一对script标签 2. 然后在里边写js代码	<script src=".js文件路径"></script>
1.外边是一对双引号里边要写一对单引号 2.外边是一对单引号里边要写一对双引号 3.不能出现一对单引号里边写一对单引号 4.不能出现一对双引号里边写一对双引号否则以上会报错原因是当一个单引号或者双引号找到另外的一个之后后边就不管了	语法 <div οnclick="js代码"></div> 和a标签的区别: 不需要 javascript: 而是用户触发执行js代码	1.可以写在 head 中也可以写在body中也可以都写一个页面可以有多对script标签 2.不需要用户触发才执行js代码而是打开页面自动执行 3.推荐大家把script标签写在body的末尾后边详细学习 4. js代码遵循从上到下的一个执行顺序	注意事项： 1.如果外链那么 script标签中间不要写任何内容没有意义 2.比如 <script src=".js文件路径">alert(666)</script> 没有意义 3.一个html 可以链接 n多个js 文件 4.执行顺序: 从上到下执行 5.跟内联一样都是打开页面自动执行,不需要用户去触发它

三、JS注释

单行 // Ctrl+/
多行 /**/
不影响代码的运行
帮助我们更好的阅读代码
把不用的代码注释掉

四、JS输出语句

alert(); 弹框体验太差
console.log(); 建议使用这个这个有个好处我能获取更详细的信息后边学完数据类型以后给大家演示
document.write(); 将内容输出到页面上可能会破坏页面的结构

五、JS输入语句

prompt('提示内容','默认内容');

六、变量

定义变量：
                var 变量名 = 值;
                var num = 666; # 把666放到一个名字叫num的箱子里
                var：定义变量的关键词
                num：变量名
                =：不是我们生活中的等号赋值符号也就是把右边的给到左边
666 值放到箱子中的值

七、变量的命名规则和规范

规则	规范
必须遵守	可以遵守可以不遵守最好遵守
1. 变量名只能是字母a-zA-Z 数字0-9 下划线_ $(美元) 组成	1. 变量名尽量有意义不能起名 aaa bbb ccc 例如：username user_age
2. 变量名不能以数字开头	2. 变量名尽量用小驼峰命名法或者大驼峰小驼峰第一个单词首字母小写后面每个单词首字母大写例如： userName userAge 大驼峰每个单词首字母大写例如：UserName UserAge
3. 严格区分大小写	3. 下划线命名法例如：user_name user_age
4. 不能是关键字(正在用的)和保留字(将来要用的)	4. 不能用中文
var num = 100; var NUM = 200; console.log(num); // 100

八、数据类型

基本数据类型	复杂数据类型
数值 Number： 1. 整数 100 2. 浮点数 100.5 3. 科学计数 100e2 4. 二进制八进制十六进制 5. Infinity -Infinity 正无穷负无穷 6. NaN
字符串 String： 1. 被引号包过的内容就是字符串 '' 单引号 "" 双引号 `` 反单引号都是成对出现一旦找到另外一个整个字符串结束 ' " ' " => 绝对不可以
布尔类型 Boolean： 1. true 2. false
undefined：输出为 undefined 空
空 Null：输出为 null

九、字面量

一个数值一个字符串 true都是一个字面量	数字的范围
1. 数值字面量 1 1.23 0xff 0b1010 0o767	alert(Number.MAX_VALUE); // 注意大小写 alert(Number.MIN_VALUE); // 注意大小写
2. 字符串字面量 'hello' "hello" `hello`	alert(Number.MAX_VALUE2); // 输出为 Infinity alert(-Number.MAX_VALUE2);// 输出为 -Infinity
3. 布尔字面量 true false
4. null字面量 null
5. undefined字面量 undefined

十、isNaN 判断值是否为非数字

NaN： Not a Number 非数字

isNaN() 判断一个值是否是NaN 非数字

例： console.log(isNaN(666)); // 666 是数字所以结果是false

console.log(isNaN('test')); // test 不是数字所以结果是true

十一、字符串（重点）

引号的嵌套	转义字符	字符串的长度	字符串的拼接
'' 单引号 "" 双引号 `` 反单引号能解析变量里边的内容原样显示	\n 换行	字符串.length;	+ 两边如果都是数字那么相加
嵌套：一对单引号中包裹一对双引号或者一对反单引号一对双引号中包裹一对单引号或者一对反单引号一对反单引号中包裹一对双引号或者一对单引号	\t tab键	代码： alert(test.length);	+ 左右只要有一个是字符串那么就是拼接
注意：拒绝交叉嵌套 var name = '陌上人如玉,'公子'世无双'; // 报错 var name = '陌上人如玉,"公子"世无双'; // 对 var name = '陌上人如玉,`公子`世无双'; // 对 var name = '陌上人如玉,"公子'世无双"; // 报错	\\ 原样显示 \		拼接就是连在一起