JavaScript基础知识

作者: 张氏小毛驴 | 来源:发表于2022-04-01 15:37 被阅读0次

JavaScript基础知识

JavaScript的基本知识大部分和Java的类似，这里是学习JavaWeb过程中学的JS，并未深入学习！

js的引入方式
- 内部js
  
  与html结合，定义<script>，标签内写js代码
- 外部js
  
  外部js文件，使用<script>标签，通过src属性引入外部js文件
注意：
- <script>可以定义在HTML任意位置，但是位置会影响执行顺序，一般都是定义在body标签里面的最后。
- <script>标签可以定义多个。
js的注释方式

与Java一样，单行注释使用//，多行注释使用/* */
基本语法
- js基本语法与java相似，语句以分号;结尾，但js并不强制要求每个语句加分号，js的引擎会自动给每个语句补上分号，但这种情况下有时候会改变程序的语义，导致运行结果有问题。
  
  建议每一句js语句都加上分号。
- js严格区分大小写。
JS的数据类型

JS数据类型包括原始数据类型和引用数据类型，使用typeof运算符可以获取变量的类型（null运算后得到的是object）
- JS中定义了以下几种原始数据类型：
  1. number
    
    数字类型，不区分整数和浮点数，统一用number表示。
    
    number包含整数，浮点数和NaN（Not a Number,表示不是数字的数字类型)
  2. string
    
    字符串类型，可以用单引号或双引号
  3. boolean
    
    布尔类型，只有true和false两种值
  4. null
    
    表示空值，是一个对象为空的占位符
  5. undefined
    
    未定义，如果一个变量没有初始化值，就会被默认赋值为undefined
- 引用数据类型：对象
JS变量

JS是一门弱类型语言

定义变量使用var关键字，比如var 变量名 = 初始化值
运算符
- 一元运算符
  
  ++：自增
  
  --：自减
  
  +(-)：正负号
- 算数运算符
  
  +，-，*，/，%
- 赋值运算符
  
  =，+=，-=
- 比较运算符
  
  >，<，=， ==，===(全等)
  
  比较规则：
  1. 类型相同：直接比较，对于字符串，按照字典的顺序，按位逐一比较，直到得出大小为止。
  2. 类型不同：先进性类型转换，再比较
    
    其中对于全等于===：先判断类型，类型不同直接返回false
- 逻辑运算符
  
  &&，||，!
  
  其他类型转为boolean：
  1. number：0或NaN为false，其他为true
  2. string：除了空字符串""，其他为true
  3. null和undefined：都是false
  4. 对象：所有对象都为true
- 三元运算符
  
  ?:表达式
流程控制语句
- if...else...
- switch
  
  可以接受任意的原始数据类型
- while
- do...while
- for
JS基本对象
- Function：函数(方法)对象
  1. 有三种创建方式（一般只有后面两种）
    - var fun = new Function(形式参数列表，方法体)
    - function 方法名称(形参列表) { }
    - var 方法名 = function(形参列表) { }
  2. 属性：length，代表形参的个数
  3. 特点：
    - 方法定义时，形参类型不需要写，返回值类型也不需要写
    - 方法是一个对象，如果定义相同名称的方法，则会覆盖前面定义的方法
    - 方法的调用只与方法名称有关，跟传递参数多少个无关
    - 方法声明中有一个隐藏的内置对象(其实就是数组)arguments，保存了所有的实际参数。
- Array：数组对象
  1. 创建方式：
    - var arr = new Array(元素列表)
    - var arr = new Array(默认长度)
    - var arr = [元素列表]
  2. 内置方法(列举常用的)
    - join(参数)：将数组中的元素按照给定的分隔符拼接为字符串
    - push()：向数组末尾添加一个或更多元素，并返回新的长度
  3. 属性：length，数组的长度
  4. 特点
    - JS中的数组，元素类型是可变的
    - JS中的数组，数组长度是可变的
- Boolean
  
  boolean类型的包装类
- Date：日期对象
  1. 创建方式
    
    var date = new Date()
  2. 方法
    - toLocaleString()：据本地时间格式，把 Date 对象转换为本地字符串。
    - getTime()：返回 1970 年 1 月 1 日至今的毫秒数。
- Math：数学对象
  1. 创建
    
    Math对象不用创建，直接使用，使用方式：Math.方法名()(类似Java静态方法调用)
  2. 方法
    - random()：返回 0 ~ 1 之间的随机数。含0不含1
    - ceil(x)：对数进行上舍入。
    - floor(x)：对数进行下舍入。
    - round(x)：把数四舍五入为最接近的整数。
  3. 属性：PI，圆周率
  4. 取随机整数
```
/**
* 取 1~100之间的随机整数
*      1. Math.random()产生随机数：范围 [0,1)小数
*      2. 乘以 100 --> [0,99.9999] 小数
*      3. 舍弃小数部分 ：floor --> [0,99] 整数
*      4. +1 -->[0,99] 整数 [1,100]
*/
var number =  Math.floor((Math.random() * 100)) + 1;
 /* 
    返回一个在myMin(包括myMin)和myMax(包括myMax)之间的随机数。
 */
function randomRange(myMin, myMax) {
    return Math.floor(Math.random() * (myMax - myMin + 1)) + myMin; 
}
```
- Number
  
  Number 对象是原始数值的包装对象。
- String
  
  String 对象用于处理文本（字符串）。
- RegExp：正则表达式对象
  1. 创建
    - var reg = new RegExp("正则表达式","修饰符")
      
      当使用构造函数创造正则对象时，需要常规的字符转义规则（在前面加反斜杠 \）。比如，var reg = new RegExp("\\w")
    - var reg = /正则表达式/修饰符
  2. 正则表达式规则详看java部分的正则介绍
    
    这里的修饰符有三种：
    - i：忽略大小写
    - g：执行全局匹配（查找所有匹配而非在找到第一个匹配后就停止）
    - m：执行多行匹配
  3. 方法
    - test(参数)：检索字符串中指定的值。返回 true 或 false。
    - exec()：检索字符串中的指定值。返回值是被找到的值。如果没有发现匹配，则返回 null。
    - compile()：编译正则表达式
```
var patt1=new RegExp("e"); 
document.write(patt1.exec("The best things in life are free")); // 输出：e
```
- Global：全局对象。能够不用对象名就可以直接调用方法。方法名()
  1. 方法
    - encodeURI()：url编码
    - decodeURI()：url解码
    - encodeURIComponent()：把字符串编码为 URI 组件。（编码的字符更多）
    - decodeURIComponent()：解码一个编码的 URI 组件。
    - parseInt()：将字符串转为数字
      
      逐一判断每一个字符是否是数字，直到不是数字为止，将前边数字部分转为number
    - isNaN()：判断一个值是否是NaN
      
      NaN六亲不认，连自己都不认。NaN参与的==比较全都为false
    - eval()：计算 JavaScript 字符串，并把它作为脚本代码来执行。

JavaScript基础知识

JavaScript基础知识

相关文章

网友评论

延伸阅读

深度阅读

栏目导航

热点阅读