学习js的一些笔记

1，对变量的一些认识

在学习java的过程中，我对变量的理解，其实就是一个在运行期进行简单储存的数据的内存空间，运行期结束后就会在各个代码的垃圾回收机制中在内存空间中消除。

对于变量，在java中，一个被创建的变量，就只能储存同类型的数据，除了多态有一些简简单单的例外之外（父类变量存储子类对象）

但在学习js的过程中，我发现，一个被定义的变量，并不一定只能储存一个类型的数据！

比如：

var a ="123";
a=123;

这样的代码在java中是绝对不能实现的，一个储存了字符串数据类型的变量，是绝对不可能再储存整型。然而在js中却可以。

现在我们来说一说变量：

变量实际上是在内存中开辟了一个空间，用来存储一个数据！

在java这种强类型的变量语言中，在创建变量开辟空间的时候，java将这个内存空间所储存的类型所固定，使之只能存储固定类型的数据，

而js这种弱类型的语言中，只开辟了空间，并没有固定其所存储的数据类型，所以可以随意的转换！

（所有的强类型语言都会这样，弱类型也是）

js变量演示：

typeof(变量名)可以获取变量类型

//定义number类型
        let a =123;
        let b =123.1;
        let c =NaN;
        document.write(a+"----"+typeof(a)+"<br>");
        document.write(b+"----"+typeof(b)+"<br>");
        document.write(c+"----"+typeof(c)+"<br>");
 //定义String类型
        let a1="123";
        let b1='123';
        let c1="abv";
        document.write(a1+"----"+typeof(a1)+"<br>");
        document.write(b1+"----"+typeof(b1)+"<br>");
        document.write(c1+"----"+typeof(c1)+"<br>");
        document.write("<br>");
//定义boolean类型
        let  a2=false;
        let  b2=true;
        document.write(a2+"----"+typeof(a2)+"<br>");
        document.write(b2+"----"+typeof(b2)+"<br>");
        document.write("<br>");
//定义null
        let a3=null;
        let b3=undefined;
        let c3;
        document.write(a3+"----"+typeof(a3)+"<br>");
        document.write(b3+"----"+typeof(b3)+"<br>");
        document.write(c3+"----"+typeof(c3));
        document.write("<br>");

输出结果：

123----number
123.1----number
NaN----number
​
123----string
123----string
abv----string
​
false----boolean
true----boolean
​
null----object
undefined----undefined
undefined----undefined

js这里有个小问题，用var或者let可以定义变量，但直接不写，也可以定义变量，两者区别在于，var和let定义的是局部变量，不写直接是全局变量！

2，流程控制语句Switch

Switch语句结构：

Switch（变量）：
​
•case  值：

在Java中，Switch能接受的数据类型：byte short int long char 枚举（1.5） 字符串（1.7）

但在js中， Switch能接受任意类型的数据！

3，一个简单的练习，在页面上输出99乘法表

<script>
document.write("<table  align='center' >");
        for (let i = 1 ; i < 10 ; i++){
            document.write("<tr>");
            for (let j = 1 ; j <= i ; j++){
                document.write("<td>");
​
                document.write(i + "*" + j + "=" + i*j);
​
                document.write("</td>");
​
            }
            document.write("</tr>");
            // document.write("<br>");
        }
        document.write("</table>");
​
    </script>
    <style>
        td{
            border: 1px solid;
        }
    </style>

4，js的常见对象

Function对象(函数对象)

1，创建

三种：

1，基本不用，看个热闹

let fun = new function(形式参数列表,方法体)；

2，这个和java方法挺像的，用的非常多，可记

function 方法名(形式参数列表){
方法体
}
​
例：
​
 function a(a1,b1){
    document.write(a1+b1);
    }

3，这个用的也比较多

let  方法名 = function(形参列表){
方法体；
}
​
例：
​
let  a  =function(a1 , b1 ){
document.write(a1+b1);
}

2，方法

3，属性

1，length属性：代表形参的个数。

使用方式

对象名.length

4，特点

1，方法定义的时候，形参和返回值的类型不用写，反正都是var或者let，写了也没啥用

2，方法是一个对象，如果重复定义，会覆盖而不会报错。

3，在js中，方法的调用只与方法名有关，与形参列表无关

4，在方法声明中只有一个隐藏的内置对象（数组），arguments，封装所有实际参数

5，调用

方法名(实际参数列表)

Array对象（数组对象）

1，创建

也是三种：

1，

let 数组名 = new Array(元素列表);

2，

let 数组名 = new Array(默认长度);

3，

let 数组名 = [元素列表];

2，方法

1，jion（参数）：将数组中的元素按照指定的分隔符进行分割，，例：

  let a1 = new Array(5);
  for (let i = 0 ; i < a1.length ; i++){
            a1[i]=i;
        }
  document.write(a1.join("--")+"<br>");
    
  打印效果：
  0--1--2--3--4

2，向数组末尾添加一个或更多元素，并返回新的长度，，例（接上面的代码）：

document.write(a1.push("5",6)+"<br>");
​
打印效果：
0--1--2--3--4
7

3，属性

length，数组长度

4，特点

1，js中，数组元素的类型是可以变的，可以理解为java的Obj类型数组

2，js中，数组长度可变

Date对象（时间对象）

1，创建

var 对象名 = new Date();

2 ，方法

toLocaleString()，返回当前date对象对应的时间本地字符串格式

 let a2 =new Date();
 document.write(a2+"<br>");
 document.write(a2.toLocaleString()+"<br>");
​
打印结果：
Tue Dec 27 2022 18:36:03 GMT+0800 (中国标准时间)
2022/12/27 18:36:03

getTime()，返回当前毫秒值，，返回当前时间与1970年1月1日0点0分的毫秒值差

document.write(a2.getTime()+"<br>");
​
打印结果:
1672137363540

Math对象（数学对象）

1，创建

这个对象很特殊，不需要创建，直接使用

使用：Math.方法名()；、

2，方法

1，random()，返回一个0.0到1.0之间的伪随机数（含0不含1）

 document.write(Math.random()+"<br>");


打印结果：

0.14629435714864747

2，ceil(参数)，对数进行向上舍入

document.write(Math.ceil(Math.PI)+"<br>");
​
打印结果：
4

3，floor(参数)，对数进行向下舍入

document.write(Math.floor(Math.PI)+"<br>");
​
打印结果：
3

4，round(x)，把数四舍五入为最近的整数

document.write(Math.round(Math.PI)+"<br>");
​
打印结果：
3

3，属性

PI 圆周率

document.write(Math.PI+"<br>")
​
打印结果：
3.141592653589793

小练习：1-100间的随即整数：

  <script>      
function  suiji(){
            return Math.floor(Math.random()*99);
        }
        for (let  i = 0 ; i < 100 ; i ++){
            document.write(suiji()+",")
}
</script>
​
打印结果：
25,78,25,91,84,68,11,10,19,10,31,31,25,2,91,91,86,74,52,10,67,7,7,83,19,68,89,19,75,25,54,52,87,16,47,44,40,72,29,68,55,0,37,39,73,55,44,28,41,84,78,84,24,88,83,68,5,22,84,53,9,70,25,22,6,51,2,37,71,24,66,98,10,48,75,68,82,31,63,94,56,11,81,74,95,98,44,30,37,60,90,29,71,0,90,8,35,51,43,75，

RegExp对象（正则表达式对象）

正则都知道吧？

说一下js里的正则规则：

1，正则表达式

1，单个字符：[]

例：

表示单个a： [a];
​
•表示a或b： [ab];
​
•表示a到z：  [a-z];
​
•表示a到z或者A到Z：  [a-zA-Z];
​
•表示a到z或者A到Z或者0到9或者下划线：  [a-zA-Z0-9_];

特殊的单个字符表示：

/d：单个数字，，也就相当于[0-9]

/w： 单个字符，，相当于[a-zA-z0-9_]

2，量词符号：

?：表示0次或1次

*： 表示0次或多次

+： 表示1次或多次

{m,n}：表示 m <= 数量 <= n

这里如果m没写，就是这样{,n}:表示最多有n个

n没写，{m,} ：表示最少有m个

3，开始结束符号

^： 开始

$： 结束

小练习：输入账号，要求6-12位，的字符

/w{6,12}

2，正则对象

创建

1，

let 对象名 = new RegExp("\正则表达式");

2，

let 对象名 = /正则表达式/;

方法

tast(参数) :验证指定字符是否符合正则规则，符合返回true，不符合返回false

Global对象（全局对象）

1，特点

全局对象，这个Global中封装的方法不需要对象就可以直接调用。

方法名();

2，方法

1，encodeURI()： url编码

let gl = encodeURI("鹏哥真帅");
document.write(gl);
​
打印结果：
%E9%B9%8F%E5%93%A5%E7%9C%9F%E5%B8%85

2，decodeURI()： url解码

document.write(decodeURI(gl));
​
打印结果：
鹏哥真帅

3，encodeURIComponent()：url 编码

这两个和上面两个的区别就在于参数的大小，对于大量数据的解码，编码，用这两个长的，比较好

4，decodeURIComponent()：url 解码

编码方式

这里介绍一下，浏览器的编码方法：

假设现在有汉字：

鹏哥真帅

现在，假设用GBK码的编码方式，那么一个汉字是2个字节，一个字节是8位2进制数

那么鹏哥真帅这四个字，就会有32位字节

现在，我们再假设，鹏哥真帅 这四个字的编码为

10010010 10010010 10010010 10010010

这32位，然后咱们以8位为限制，转换成数字，中间以%隔开，那么最后得到一个结果（这里也是假设哈，我直接用encodeURI()这个方法 的编码出来了，结果如下）

%E9%B9%8F%E5%93%A5%E7%9C%9F%E5%B8%85