第六周学习笔记

lm_216416

已于 2022-12-03 13:37:10 修改

阅读量219

点赞数

文章标签：学习 javascript 前端

于 2022-12-02 17:44:08 首次发布

本文链接：https://blog.csdn.net/lm_216416/article/details/128048564

版权

Web前端从入门到放弃第六周学习笔记

一、JavaScript
- 1.什么是语言
- 2.JavaScript简介
二、JS的 HelloWorld
三、输出语句
四、在内容中嵌入JS
五、注释
六、字面量和变量
七、标识符
八、数据类型
九、进制
十、算数运算符

声明：本学习内容来自于 (尚硅谷JavaScript基础&实战丨JS入门到精通全套完整版) 侵删致歉！

一、JavaScript

1.什么是语言

计算机就是一个由人来控制的机器，人让它干嘛，它就得干嘛。
我们要学习的语言就是人和计算机交流的工具，人类通过语言来控制、操作计算机。
编程语言和我们说的中文、英文本质上没有区别，只是语法比较特殊。
语言的发展∶
- 纸带机:机器语言
- 汇痛语言∶符号语言
- 现代语言∶高级语言

2.JavaScript简介

起源
- JavaScript诞生于1995年，它的出现主要是用于处理网页中的前端验证。
- 所谓的前端验证，就是指检查用户输入的内容是否符合一定的规则。
- 比如︰用户名的长度，密码的长度，邮箱的格式等。
简史
- JavaScript是由网景公司发明，起初命名为LiveScript，后来由于SUN公司的介入更名为了JavaScript。
- 1996年微软公司在其最新的IE3浏览器中引入了自己对JavaScript的实现JScript。
- 于是在市面上存在两个版本的JavaScript，一个网景公司的JavaScript和微软的JScript。
- 为了确保不同的浏览器上运行的JavaScript标准一致，所以几个公司共同定制了JS的标准名命名为ECMAScript。
实现
- ECMAScript是一个标准，而这个标准需要由各个厂商去实现。
- 不同的浏览器厂商对该标准会有不同的实现。
- 我们已经知道ECMAScript是JavaScript标准，所以一般情况下这两个词我们认为是一个意思。
- 但是实际上JavaScript的含义却要更大一些。
- 一个完整的JavaScript实现应该由以下三个部分构成:
  - DOM:文档对象模型（操作网页）
  - BOM:浏览器对象模型（操作浏览器）
特点
- 解释型语言
- 类似于C和Java的语法结构
- 动态语言
- 基于原型的面向对象
  ·

二、JS的 HelloWorld

JS的代码要写在 scrip 标签里

<body>
    <script type="text/javascript"> type属性默认值为JavaScript
        alert(" hello world"); 
        
    </script>
 </body>

三、输出语句

alert（）：弹窗
document.write（）：在body中输出内容
console.log（）：向控制台输出内容

四、在内容中嵌入JS

JS 可写在标签属性中，但结构与行为耦合，不方便维护，不推荐使用

<body>
    <button onclick="alert('Hello world')">点一下</button>
    <a href="javascript:alert('Hello world')">再点一下</a>
 </body>

JS也可以与CSS文件一样，创建外部文件，再引用*
注：在同一个scrip标签一旦从外部引入js，就不能从内部实现js了，如需要则可以再新建一个script标签

<script src="路径.js">该内部处再写JS会无效</script>
<script >该处没引入外部JS，则可实现内部JS</script>

五、注释

多行注释：/* */
- /*
  * 注释
  * 内容
  * /
单行注释：// （注释后面的内容，前面不受影响）

六、字面量和变量

字面量：不可变量（如1 2 3 4）
变量：可变，可用来储存
声明变量：使用关键字来声明一个变量（var a；）
声明与赋值可同时进行：var a=123 ；

七、标识符

在JS中所有的可以由我们自主命名的都可以称为是标识符
- 例如:变量名、函数名、属性名都属于标识符
命名一个标识符时需要遵守如下的规则:
- 1.标识符中可以含有字母、数字、_、$
- 2.标识符不能以数字开头
- 3.标识符不能是ES中的关键字或保留字
- 4.标识符一般都采用驼峰命名法（首字母小写,每个单词的开头字母大写，其余字母小写，如：helloWorld、xxxYyyZzz）
JS底层保存标识符时实际上是采用的Unicode编码
- 所以理论上讲，所有的utf-8中含有的内容都可以作为标识符|

八、数据类型

数据类型指的就是字面量的类型在JS中一共有六种数据类型
- string字符串
- Number数值
- Boolean布尔值Null空值
- Undefined 未定义object对象

其中String Number Boolean Null Undefined属于基本数据类型而Object属于引用数据类型

String字符串
- 在JS中字符串需要使用引号引起来
- 使用双引号或单引号都可以，但是不要混着用
- 相同引号不能嵌套，双引号不能放双引号，单引号不能放单引号
number
- 在JS中所有的数值都是Number类型，包括整数和浮点数（小数)
- JS中可以表示的数字的最大值 Number.MAX_VALUE（1.7976931348623157e+308）
  Number.MIN_VALUE大于0的最小值（5e-324）
- 如果使用Number表示的数字超过了最大值，则会返回一个
  - Infinity表示正无穷
  - Infinity表示负无穷
- 使用typeof检查Infinity也会返回numberNaN是一个特殊的数字，表示Not A Number
  使用typeof检查一个NaN也会返回number
布尔值 Boolean
- 布尔值只有两个：ture （表示真）、false（表示假）
Null
- Null只有一个值：Null ，专门用来表示一个空的对象（类型为object）
- Undefined（未定义）类型的值只有一个，就undefind当声明一个变量，但是并不给变量赋值时，它的值就是undefined
强制类型转换
指将一个数据类型强制转换为其他的数据类型-类型转换主要指，将其他的数据类型，转换为
string Number Boolean
- 将其他的数据类型转换为String
  - 方式一:
    - 调用被转换数据类型的toString()方法
      语法： a.tostring（a）；
    - 该方法不会影响到原变量，它会将转抉的结果返回
    - 但是注意: null和undefined这两个值没有toString()方法，如果调用他们的方法，会报错
  - 方式二:
    - 调用String()函数，并将被转换的数据作为参数传递给函数
      语法：a = string（a）；
    - 使用String()速数做强制类型转换时，
      - 对于Number和Boolean实际上就是调用的toString()方法
      - 但是对于null和undefined，就不会调用toString()方法
        它会将null直接转换为"null"
        将undefined直接转换为“undefined"
- 将其他的数据类型转换为Number转换
  - 方式一:
    使用Number(十函数
    - 字符串–>数字
      1.如果是纯数字的字符串，则直接将其转换为数字
      2.如果字符串中有非数字的内容，则转换为NaN
      3.如果字符串是一个空串或者是一个全是空格的字符串，则转换为0
    - 布尔–>数字
      - true转成1
      - false转成0
    - nil -->数字：0
    - undefined -->数字：NaN
  - 转换方式二:
    - 这种方式专门用来对付字符串
    - parseInt()把一个字符串转换为一个整数
    - parseFloat(把一个字符串转换为一个浮点数
      如果对非String使用parseInt( )或parseFloat()它会先将其转换为String，然后在操作
- 将其他的数据类型转换为Boolean-使用Boolean()函数
  - 数字—>布尔
  - 除了0和NaN，其余的都是true-字符串––>布尔
  - 除了空串，其余的都是true
  - null和undefined都会转换为false
  - 对象也会转换成true

九、进制

二进制以0b开头：0b10 → 2（十进制）
八进制以0开头： 010 → 8（十进制）
十六进制以0x开头： 0x10 → 16（十进制）
若要把字符串类型改为number，则可以用 parseint（）函数，语法为： a = paresint（a，进制）

十、算数运算符

算数运算符
当对非Number类型的值进行运算时，会将这些值转换为Number然后在运算

任何值和NaN做运算都得NaN
” + “
+可以对两个值进行加法运算，并将结果返回
如果对两个字符串进行加法运算，则会做拼串，会将两个字符串拼接为一个字符串，并返回
任何的值和字符串做加法运算，都会先转换为字符串，然后再和字符串做拼串的操作
- 我们可以利用这一特点，来将一个任意的数据类型转换为String
- 我们只需要为任意的数据类型＋一个""”即可将其转换为String
- 这是一种隐式的类型转换，由浏览器自动完成，实际上它也是调用String（）函数
" - "
-可以对两个值进行减法运算，并将结果返回
” * “
*可以对两个值进行乘法运算
” / “
/可以对两个值进行除法运算
” % “
%取模运算（取余数)

除了加法外，任何值进行减、乘、除运算时都会自动转换为number

元运算符

一元运算符，只需要一个操作数+正号
- 正号不会对数字产生任何影响-负号
- 负号可以对数字进行负号的取反
- 对于非Number类型的值，它会将先转换为Number，然后在运算
  可以对一个其他的数据类型使用+,来将其转换为number它的原理和Number()函数一样
自增＋+
- 通过自增可以使变量在自身的基础上增加1
- 对于一个变量自增以后，原变量的值会立即自增1
- 自增分成两种:后++(a++)和前++(++a)
  无论是a++还是++a，都会立即使原变量的值自增1
- 不同的是a++和++a的值不同
  a++的值等于原变量的值（自增前的值)++a的值等于新值(自增后的值)
自减 - -
- 通过自减可以使变量在自身的基础上减1
- 自减分成两种:后–(a–)和前–(–a)，无论是a–还是–a都会立即使原变量的值自减1
- 不同的是a–和–a的值不同
  a- - 是变量的原值（自减前的值) - -a是变量的新值（自减以后的值)

逻辑运算符

! 非
- !可以用来对一个值进行非运算
  -所谓非运算就是值对一个布尔值进行取反操作，
  true变false， false变true
- 如果对一个值进行两次取反，它不会变化
- 如果对非布尔值进行元素，则会将其转换为布尔值，然后再取反
  所以我们可以利用该特点，来将一个其他的数据类型转换为布尔值
  - 可以为一个任意数据类型取两次反，来将其转换为布尔值，原理和Boolean(()函数一样
&&与
- &&可以对符号两侧的值进行与运算并返回结果
- 运算规则
  - 两个值中只要有一个值为false就返回false,
    只有两个值都为true时，才会返回true
  - JS中的“与”属于短路的与，如果第一个值为false，则不会看第二个值
| | 或
- | | 可以对符号两侧的值进行或运算并返回结果
- 运算规则:
  - 两个值中只要有一个true，就返回true
    如果两个值都为false，才返回false
  - JS中的或”属于短路的或，如果第一个值为true，则不会检查第二个值

非布尔值的情况

对于非布尔值进行与或运算时，会先将其转换为布尔值，然后再运算，并且返回原值

与运算:
- 如果第一个值为true，则必然返回第二个值
- 如果第一个值为false，则直接返回第一个值
或运算
- 如果第一个值为true，则直接返回第一个值
- 如果第一个值为false，则返回第二个值

关系运算符

通过关系运算符可以比较两个值之间的大小关系，
如果关系成立它会返回true，如果关系不成立则返回false

> 大于号
- 判断符号左侧的值是否大于右侧的值
- 如果关系成立，返回true，如果关系不成立则返回false
> = 大于等于
- 判断符号左侧的值是否大于或等于右侧的值
< 小于号
- < = 小于等于
非数值的情况
- 对于非数值进行比较时,会将其转换为数字然后在比较
- 如果符号两侧的值都是字符串时r不会将其转换为数字进行比较,而会分别比较字符串中字符的Unicode编码
相等运算符用来比较两个值是否相等，如果相等会返回true，否则返回false
- 使用 = = 来做相等运算
  - 当使用= =来比较两个值时，如果值的类型不同，则会自动进行类型转换，将其转换为相同的类型然后在比较
  - Nan不等于任何，包括其本身
  - 检查Nan，可以用 **isNan（）**检查
- ! = 不相等
  不相等用来判断两个值是否不相等，如果不相等返回true，否则返回false
- 使用!=来做不相等运算,不相等也会对变量进行自动的类型转换，如果转换后相等它也会返回false
- = = = 全等
  - 用来判断两个值是否全等，它和相等类似，不同的是它不会做自动的类型转换,如果两个值类型不同，直接返回false
- ! == 不全等
  - 用来判断两个值是否不全等，和不等类似，不同的是它不会做自动的类型转换
  - 如果两个值的类型不同，直接返回true
条件运算符也叫三元运算符语法:
- 条件表达式?语句1:语句2;-执行的流程:
  - 条件运算符在执行时,首先对条件表达式进行求值，
    如果该值为true，则执行语句1，并返回执行结果如果该值为false，则执行语句2，并球回执行结果
  - 如果条件的表达式的求值结果是一个非布尔值，会将其转换为布尔值然后再运算