JavaScript基础知识3

最新推荐文章于 2024-09-10 19:15:21 发布

aaa小葵

最新推荐文章于 2024-09-10 19:15:21 发布

阅读量101

点赞数

分类专栏：前端文章标签： javascript 前端开发语言

本文链接：https://blog.csdn.net/m0_74033027/article/details/128384587

版权

前端专栏收录该内容

9 篇文章 0 订阅

订阅专栏

JavaScript基础知识3

21.对象的简介

对象属于一种复合型的数据类型，在对象中可以保存多个不同数据类型的属性

对象的分类：
1.内建对象
在ES标准中定义的对象，在任何的ES的实现中都可以使用
eg.Math String Number Boolean Function Object…
2.宿主对象
由JS的运行环境提供的对象，目前来讲主要指由浏览器提供的对象
eg.BOM DOM
3.自定义对象
由开发人员自主创建的对象

22.对象的基本操作

创建对象：

// 使用new关键词调用的函数，是构造函数constructor
// 构造函数是专门用来创建对象的函数
        var obj=new Object();
        console.log(obj);

console.log(typeof obj);//返回object

向对象中添加属性：

语法：对象.属性名=属性值

// 在对象中保存的值称为属性
        obj.name="lucy";
        obj.gender="女";
        obj.age=22;
        console.log(obj);
// Object name: "lucy" gender: "女"  age: 22

读取对象中的属性：

语法：对象.属性名

console.log(obj.age)//返回22
// 如果读取对象中没有的属性不会报错，而是返回undefined

修改对象属性：

语法：对象.属性名=属性值

obj.name="tom";

删除对象属性：

语法：delete 对象.属性名

delete obj.name;

使用工厂方法创建对象：

使用工厂方法创建的对象使用的构造函数都是object，所以创建的对象都是object类型的，无法区分

      function cp(name,age,sayName){
            //创建对象
            var obj=new Object;
            //向对象中添加属性
            obj.anme=name;
            obj.age=age;
            obj.sayName=function(){
                alert(this.name);
            }
            // 将新的对象返回
            return obj;
        }
        var obj2=cp("candy",18);
        // 返回candy 18...
        obj2.sayName();
        // 返回candy

23.属性名和属性值

属性名

对象的属性名不强制要求遵守标识符的规范，但使用时尽量按照标识符规范明命名；
如果需要使用特殊的属性名，不能采用.的方式来操作；
特殊属性的添加和读取方式:语法: 对象["属性名"]=属性值；

obj.["125"]=789;

在[]中可以直接传递一个变量，这样变量值是多少就读取那个属性

        obj.["rad"]=123;
        obj.["six"]=6;
        var n="six";
        console.log(obj[n]);
        // 返回6

属性值
JS的属性值可以是一个任意的数据类型，也可以是对象

        var obj1=new Object();
        obj1.name="lucy";
        var obj2=new Object();
        obj2.name="candy";
        obj1.test=obj2;
        console.log(obj1.test.name);
        // 返回candy

in 运算符

通过in运算符可以检查一个对象中是否含有指定的属性，如果有则返回true，没有则返回false；
语法：“属性名” in 对象

console.log("test2" in obj);

使用in运算符检查属性时，如果对象中没有但原型中有，也返回true

24.基本和引用数据类型

基本数据类型

        var a=123;
        var b=a;
        a++;
        console.log("a="+a);
        console.log("b="+b);
        //返回a=124 b=123

JS中的变量都是保存到栈内存中的；
基本数据类型的值直接在栈内存中储存，值与值之间相互独立，修改一个变量不会改变其他变量；

        // 当比较两个基础数据类型的值时，就是比较值
        var c=10;
        var d=10;
        console.log(c==d);
        //ture

引用数据类型

        var obj=new Object;
        obj.name="孙悟空";
        var obj2=obj;
        //修改obj的name属性
        obj.name="猪八戒";
        console.log(obj.name);
        console.log(obj2.name);
        //返回值全为猪八戒

对象是保存到堆内存中，每创建一个新的对象，就会在堆内存中开辟出一个新的空间，而变量保存的是对象的内存地址（对象的引用）；
如果两个变量保存的是同一个对象引用，当一个通过一个变量修改属性时，另一个也会受到影响

修改变量值

        //修改变量的值对其他变量不产生影响
        var obj=new Object;
        obj.name="孙悟空"; 
        var obj2=obj;
        //修改obj的name属性
        obj.name="猪八戒";
        obj2=null;
        console.log(obj);
        console.log(obj2);
        //返回obj仍然为object；obj2为null

        // 而比较两个引用数据类型时的值，他是比较的对象的内存地址，如果两个对象是一模一样的，但是地址不同也会返回false
        var obj3=new Object();
        var obj4=new Object();
        obj3.name="shs";
        obj4.name="shs";
        console.log(obj3==obj4);
        //false

25.对象字面量

普通创建对象

var obj=new Object();

使用对象字面量来创建对象

var obj={};

使用对象字面量，可以在创建对象时，直接指定对象中的属性语法：{属性名：属性值，属性名：属性值……}

        var obj2={
        name:"candy",
        age:18,
        gender:"女"};      
        console.log(obj2.age);
       // 返回 18
       //对象字面量的属性名可以加引号也可以不加，如果使用特殊名字，则必须加引号

        var obj2={
            name:"candy",
            age:18,
            gender:"女"
            test:{name:"lucy"}
        };
            console.log(obj2.test);
            // 返回 lucy

26.函数的简介

函数本身也是对象

var fun=new Function("console.log('hello')");
fun();//调用函数语法：函数对象（）

使用函数声明来创建一个函数

//语法：function 函数名（[形参1，形参2……]）{ 语句 }
         function fun2(){
            console.log("hhhh")
           }
        //调用函数fun2
        fun2();

使用函数表达式来调用函数

        /*语法：
        var 函数名=function([形参1,形参2....]){
            语句...
        }*/
        var fun3=function({
            console.log("hello");
        });
        //函数调用
        fun3();

27.函数的参数

形参

1.可以在函数的（）中来指定一个或多个形参（形式参数）
2.每个形参之间用逗号隔开
3.声明形参就相当于在函数内部声明了相应的变量

 fun sum(a,b){
            console.log(a+b);
             }
sum(1+2);
//返回3
// 调用函数时候不会检查实参的类型，要注意是否会接受到非法的参数

实参

1.实参可以是任意的数据类型，也可以是一个对象
2.当参数过多时，可以将参数放入一个对象中，然后通过对象传递

28.函数返回值

返回值基本应用

1.使用return来设置函数的返回值语法：return 值
2. return后的值将会被作为函数的执行结果返回，可以定义一个变量来接受该结果
3.在函数中return后面的语句都不会执行
4.如果函数中不写return或者只写return都会返回undefined

        function sum(a,b,c){
            var d=a+b+c;
            return d;
        }

判断一个数是否为偶数

        function isou(num){
            return num%2==0;
        }
        var result=isou(15);
        // 返回false

定义一个函数可以通过半径计算圆的面积

        function s(r){
            return 3.14*r*r;
        }
        var result=s(5)

创建函数在控制台输出人的信息

        function pepole(o){
            console.log("我是"+o.name,"今年我"+o.age);
        }
        var obj={
            name:"candy",
            age:18
        };
        pepole(obj);

返回值的类型

返回值可以是任意数据类型也可以是一个对象或函数

        function fun(){
            alert("嗯嗯嗯");
            for(var i=0;i<5;i++){
                console.log(i);
                if(i==2){
                    break//函数退出当前循环
                }
            }
            alert("呜呜呜");
        }
        // 返回嗯嗯嗯 0 1 2 呜呜呜

        function fun(){
            alert("嗯嗯嗯");
            for(var i=0;i<5;i++){
                if(i==2){
                    continue//跳过档次循环
                }
            }
            alert("呜呜呜");
        }
        // 返回嗯嗯嗯 0 1 3 4 呜呜呜

        function fun(){
            alert("嗯嗯嗯");
            for(var i=0;i<5;i++){
                if(i==2){
                    return//return后均不执行
                }
            }
            alert("呜呜呜");
        }
        // 返回嗯嗯嗯 0 1

29.立即执行函数

        (function(){
            alert("wuwuu");
        })();
        // 直接执行,一般只会执行一次

30.方法

定义：如果一个函数作为一个对象的属性保存，那么我们称这个函数是这个对象的方法，调用函数就说是调用对象的方法

obj.sayName=function(){
            console.log(obj.name);
        }
        //sayName叫做obj的方法
        obj.sayName()

// 调方法
obj.sayName();
// 调函数
fun();

call()和apply()

call()和apply()都是函数方法，需要通过函数对象来调用

function fun(){
      alert(this.name);
}
    
fun();
fun.call();
fun.apply();

在调用call()和apply()时可以将一个对象指定诶第一个参数，此时这个对象会成为函数执行的this,指定this

    function fun(){
        alert(this.name);
    }
    var obj = {name:"obj"};
    var obj2 = {name:"obj2"}
    // fun();
    fun.call(obj);
    fun.apply(obj2);

区别

 function fun(a,b){
        console.log("a="+a);
        console.log("b="+b);
    }
    var obj = {
        name:"obj",
        sayName:function(){
            alert(this.name);
        }
    };
    fun.call(obj,2,3);//call () 方法可以将实参在对象之后依次传递
    fun.apply(obj,[2,3])// apply（）方法需要将实参封存到一个数组中再传递

31.枚举对象中的属性

使用for…in循环语句语法：for(var 变量 in 对象){}
1.for…in循环语句对象中有几个属性，循环体就执行几次
2.每次执行时，会将对象中的一个属性的名字赋值给变量

var obj={
            name:"candy",
            age:18
        }
for(var n in obj){
            console.log("hello");
        }
        // 返回两个hello
for(var n in obj){
            console.log("属性名:"+n);
            console.log("属性值:"+obj[n]);
        }
        //返回
        //属性名：name 属性值candy
        //属性名：age 属性值18

32.作用域

全局作用域

.直接编写在script标签中的JS代码，都在全局作用域
在页面打开时创建，在页面关闭时销毁
在全局作用域中有一个全局对象window，它代表的是一个浏览器窗口，它由浏览器创建，可以直接使用
创建的变量都会作为window对象属性保存；
创建的函数都会作为window对象的方法保存
全局作用域中的变量都是全局变量，在页面的任意部分都可以被访问

变量声明提前
使用var关键字声明的变量会在所有代码执行前被省明明（但不会赋值）；
不使用var则变量不会被声明提前

       alert("a="+a);
        var a=5;
        =
        var a;
        alert("a="+a);
        a=5
       // 返回a=undefined

       alert("a="+a);
       a=5;
       // 报错

函数声明提前
使用函数声明形式创建的函数function函数（）{}，会在所有代码执行前被创建；
使用函数表达式创建的函数，不会被声明提前

    fun();
    function fun(){
        alert("1");
    }//可以被执行
    var fun=function(){
        alert("1");
    }//报错

函数作用域

调用函数时创建函数作用域，函数执行完毕后，函数作用域销毁
每调用一次函数就会创建一个新的函数作用域，他们之间是相互独立的
在函数作用域中可以访问到全局作用域的变量，在全局作用域中无法访问函数作用域的变量
（就近原则）当函数作用域操作变量时，会现在自身作用域中寻找，如果有就直接使用，如果没有则像上一级作用域中寻找
在函数中，不使用var声明的变量都会成为全局变量
函数作用域中声明提前原理和全局作用域中相同

    // 就近原则
    var a=10;
    function fun(){
        var a=20;
        console.log("a="+a);
    }
    console.log("a="+a);
    //返回a=20 a=10

    var a=10;
        function fun(){
        var a=20;
        function fun2(){
            alert("a="+a);
        }
    }
    //返回a=20
        function fun(){
        var a=20;
        function fun2(){
            alert("a="+window.a);
        }
    }
    // 返回a=10

    var c=33;
    function fun5(){
        alert("c="+c);
        var c=10;
    }
    //返回undefined

  var c=33;
    function fun5(){
        alert("c="+c);
        c=10;
    }
    // 返回33

 function fun5(){
         c=10;//此时c是全局变量
}
    alert("c="+c);
    // 返回c=10

33.this和arguments

this

解析器在调用函数时候就是向函数内部传递一个隐含的参数，这个隐含的参数就是this，this指向一个对象，这个对象我们称为函数执行的上下文对象，根据函数的调用方式不同，this会指向不同对象（可以实现动态变换）

以函数的形式调用，this永远都是window
以方法的形式调用，this就是调用方法的对象
以构造函数的形式调用，this是新创建的那个对象
使用call和apply调用时，this是指定的那个对象

    var name="quanju";
    function fun(){
        alert("this.name")
    }
    var obj1={
        name:"ssk",
        sayName:fun
    }
    var obj2={
        name:"zbj",
        sayName:fun
    }
    obj1.sayName();//返回ssk
    obj2.sayName()//返回zbj

arguments

arguments是一个类数组对象，他可以通过索引来操作数据，也可以获取长度
在调用函数时，我们所传递的实参会保存在arguments中,即使不定义形参也可以操作实参
arguments.length可以用来获取实参的长度
arguments中有callee属性，对应当前正在执行的函数对象

 function fun(){
            console.log(arguments.length);
        }
        fun("hi","tutu",true);
        //3
        // 取出
 function fun(){
            console.log(arguments[0]);
        }
        fun("hi","tutu",true);
        // hi
// arguments中有callee属性，对应当前正在执行的函数对象
        console.log(arguments.callee);

34.构造函数

构造函数与普通函数的调用方式不同，普通函数直接调用，构造函数首字母要使用new关键词来调用（构造函数首字母一般大写）

构造函数的执行流程：

立刻创建一个新的对象
将新建对象设置为函数中的this，在构造函数中可以使用this来引用新建对象
逐行执行函数中的代码
将新建的对象作为返回值返回

instanceof

使用instanceof可以检查一个对象是否为一个类的实例
语法：对象 instanceof 构造函数

        // 使用同一个构造函数创建的的对象，我们称为一类对象，也将构造函数称为一类函数
        // per1/2/3为一类对象，Person为一类函数
        function Person(name,age,gender){
            this.name=name;
            this.age=age;
            this.gender=gender;
            this.sayName=function(){
                alert(this.name);
            }
        }
        function Dog(){ };
        var per1=new Person("candy",18,"女");
        var per2=new Person("july",19,"女");
        var per3=new Person("kate",17,"女");
        var dog=new Dog();
        // 将通过一格构造函数创建的对象称为是该类的实例
        // per是Person的实例，dog是Dog的实例
        console.log(per instanceof Person);//true
        console.log(dog instanceof Person);//false
        // 所有对象和Object做instanceof都会返回true
        console.log(per instanceof Object);//true
        console.log(dog instanceof Object);//true

优化构造函数

 // 优化构造函数，减少创建次数，但会污染全局作用域的命名空间，而且不安全
        function Person(name,age,gender){
            this.name=name;
            this.age=age;
            this.gender=gender;
            this.sayName=fun
        }
        // 将sayName的方法放在全局作用域中定义
        function fun(){
                alert(this.name);
            }
        var per1=new Person("candy",18,"女");
        var per2=new Person("july",19,"女");
        var per3=new Person("kate",17,"女");

35.原型对象

原型prototype对应着一个对象，这个对象称为原型对象；

// 创建的每一个函数，解析器都会向函数中添加一个prototype属性
        function Person(){}
        console.log(Person.prototype);
        // 每个函数的prototype属性不同
console.log(Person.prototype==Dog.prototype);//false

 // 如果函数作为普通函数调用，prototype不起作用；如果函数以构造函数的形式调用，它创建的对象中会有一个隐含属性，指向该构造函数的原型对象
        function MyClass(){}
        var mc=new MyClass();//通过MyClass创建的对象mc
        console.log(MyClass.prototype);
        // 隐含属性可以通过__proto__来访问该属性
        console.log(mc.__proto__);
        // 原型对象相当于一个公共区域，所有同一个类的实例都可以访问到这个原型对象
        // 可以将对象中共有的内容，统一设置到原型对象中

        // 向MyClass的原型对象中添加属性a
        MyClass.prototype.a=123;
        var mc=new MyClass();
        // 向MyClass的原型中添加一个方法
        MyClass.prototype.sayHello=function(){
            alert("555");
        }
        mc.sayHello();

原型对象相当于一个公共区域，所有同一个类的实例都可以访问到这个原型对象
在这里插入图片描述
当我们访问对象的一个属性或方法时，他会先在对象自身中寻找，如果有则直接使用，没有则去原型对象中寻找,;

在创建构造函数时，可以将这些对象共有的属性和方法统一添加到构造函数的原型对象中，这样不同分别为每一个对象添加，也不会影响到全局作用域就可以使得每个对象都具有这些属性和方法
向原型对象中添加方法：属性名.prototype.方法

原型对象也是对象，也有原型，但至多两层，到达object的原型没有原型则返回null

hasOwnProperty

使用对象的hasOwnProperty()来检查对象自身中是否含有该属性，使用该方法只有当对象自身中含有属性时才会返回true

 console.log(mc.hasOwnProperty("age"));//检查对象本身是否含有age属性

toString

当我们直接在页面中打印一个对象时，事实上是输出对象的toString（）方法的返回值；

如果我们希望在输出对象时不输出[object object]，可以作为对象添加一个toString（）方法

        Person[name="swk",age=18];
        //修改原型中的toSting
        Person.prototype.toSting=function(){
            return "Person[age="+this age"]";
        }
        var per=new Person();
        //返回Person[age=18]

36.垃圾回收

当一个对象没有任何变量或属性对它进行引用，此时我们将永远无法操作该对象，此时这种对象就是一个垃圾，这种对象过多会占用大量的内存空间，导致程序运行变慢；

在JS中拥有自动的垃圾回收机制，会自动将这些垃圾对象从内存中销毁，不需要人为处理

37.数组简介

数组也是一个对象，他和普通对象功能相似，也是用来存储值的；不同之处是普通对象是使用字符串来命名，而数组是使用数字来作为索引操作元素的
索引：从0开始的整数就是索引

 // 使用typeof检查一个数组时，他会返回object
        console.log(arr);

<script>
        var arr=new Array();
// 向数组中添加元素：语法：数组[索引]=值
        arr[2]=10;
//读取数组中的元素：语法：数组[索引]  如果读取不存在的索引，返回undefined
// 获取数组长度：语法：数组.length
        console.log(arr.length)
// 连续数组.length可以获得数组长度（元素个数）；不连续数组会获取数组最大索引数+1
// 如果修改的length大于原长度，则多出部分会空出来
</script>

// 一直向数组末尾添加元素：数组[数组。length]
       arr[arr.length]=10;

38.数组字面量

使用字面量创建数组;语法：[]

var arr =[];

创建并赋值数组

var arr=new Array(10);

        // 创建一个数组中只有一个元素10
        arr=[10];
        // 创建一个长度为10的数组
        var arr=new Array(10);

数组中的元素可以是任意数据类型

       arr = ["hello",1,true,null,undefined];

        var obj = {name:"candy"};
        arr = [{name:'candy'}];
        
        arr = {function fun() {alert("wuwu")}};
         
        // 二维数组
        arr = {[1,2,3],[3,4,5],[6,7,8]}

39.数组的方法

数组的方法

push()

可以向数组末尾添加一个或多个元素，并返回数组新的长度

pop()

pop()可以删除数组最后一个元素,并将被删除的元素返回

unshift()

向数组开头添加一个或者多个元素，并返回新的数组长度

shift()

删除并可以删除数组第一个元素,并将被删除的元素返回

var arr = new Array("swk","zbj","shs");
arr.push("ts");
alert(arr);
// return:swk,zbj,shs,ts
var result=arr.push("ts");
console.log("result="+result);
//返回数组新长度：result=4

arr.pop;//返回swk，zbj
arr.pop;//返回swk
var result=arr.pop();
console.log("result="+result);//result=shs,zgj

arr.unshift("nmw");

arr.shift();

forEach

forEach只在IE8以上浏览器支持
forEach需要函数作为参数,数组中有几个元素就执行几次，每次执行时，会以遍历到的元素以实参的形式传递进来
浏览器会在回调函数中传递三个参数
第一个参数：当前正在遍历的元素
第二个参数：当前正在遍历的参数的索引
第三个参数：当前正在遍历的数组

arr.forEach(function(value,index,obj){
            alert("value");
        });

slice()

slice()从某个已有数组返回选定元素，该方法不会改变原数组，而是另外存入新数组
arr.slice(start,end)

参数1：start：截取开始的位置索引
参数2：end：截取结束的位置索引（包头不包尾）

var arr=["西施","貂蝉","杨玉环","王昭君"];
var result = arr.slice(0,2);
console.log(result);
// 西施，貂蝉

var result = arr.slice(1);
console.log(result);
// 貂蝉，杨玉环，王昭君

// 如果传递一个负值，则从后往前计算
var result = arr.slice(1,-1);
console.log(result);
// //貂蝉，杨玉环

splice()

用于删除数组中的指定元素，并向数组添加新元素

第一个参数：表示开始位置的索引（包含开头索引）
第二个参数：表示删除数量
第三个及以后参数：可以传递新元素，会自动插入开始元素前面

var result = arr.splice(0,2);
console.log(result);//"西施","貂蝉"
console.log(arr);//"杨玉环","王昭君"

var result = arr.splice(1,2,"嫦娥","玉兔","妲己");
console.log(result);//貂蝉,杨玉环
console.log(arr);//西施，嫦娥，玉兔，妲己，王昭君

var result = arr.splice(1,0,"嫦娥","玉兔","妲己");
console.log(result);//""
console.log(arr);//西施，嫦娥，玉兔，妲己，貂蝉, 杨玉环，王昭君

concat()

concat()连接两个或更多的数组，并返回结果,该方法不会对原数组产生影响

  <script>
        var arr = ["西施","杨玉环","嫦娥"];
        var arr2 = ["王昭君","妲己","貂蝉"];
        var arr3 = ["白骨精","蜘蛛精","玉兔精"];
        var result = arr.concat(arr2,arr3,"唐僧");
        console.log(result);
        //"西施""杨玉环""嫦娥""王昭君""妲己""貂蝉""白骨精""蜘蛛精""玉兔精""唐僧"
  </script>

join()

join()将数组转换为字符串，并返回，不对原数组产生影响，在join中可以指定一个字符串作为参数，不指定则为逗号

        var arr = ["西施","杨玉环","嫦娥"];
        result = arr.join("hello");
        console.log(result);
        // “西施hello杨玉环hello嫦娥”

reverse()

reverse()用来反转数组，会直接修改原数组

        var arr = ["西施","杨玉环","嫦娥"];
        result = arr.reverse();
        console.log(arr);//嫦娥，杨玉环，西施
        console.log(result);//嫦娥，杨玉环，西施

sort()

sort()对数组的元素进行排序,也会影响原数组，默认按照Unicode编码进行排序

        var arr = ["b","d","e","a","c"];
        arr.sort();
        //abcde

对于纯数字的数组，使用sort（）排序也会按照Unicode编码来排序，可能得到错误结果

        var arr = [1,5,3,4,11,6];
        arr.sort();
        // 11,1,3,4,5,6

指定排序的规则：
在sort（）中添加一个回调函数，并来指定排序规则，回调函数要定义两个形参，浏览器会分别使用数组中的元素作为实参去调用回调函数；
浏览器会根据回调函数的返回值来决定元素的顺序
返回值>0，元素交换位置
返回值<=0，元素位置不变

      var arr = [1,5,3,4,11,6];
        var result = arr.sort(function(a,b){
            if (a>b) {
                return 1;
            }else if (a<b) {
                return -1;
            }else {
                return 0;
            }
        })
        console.log(result);
        // 升序排列  return a-b
        // 降序排列  return b-a

40.数组的遍历

遍历数组：取出数组中所有元素

var arr = new Array("swk","zbj","shs","ts");
for(var i=0;i<arr.length;i++){
console.log(arr[i]);

41.数组练习

    <script>
        function Person(name,age){
            this.name=name;
            this.age=age;
        }
        Person.prototype.toString=function(){
            return "Person[name="+this.name+",age="+this.age+"]";
        };
        var per1=new Person("孙悟空",18);
        var per2=new Person("猪八戒",28);
        var per3=new Person("红孩儿",8);
        var per4=new Person("蜘蛛精",16);
        var per5=new Person("二郎神",38);
        // 将这些person对象放入一个数组
        var perArr=[per1,per2,per3,per4,per5];
        // 创建一个函数可以将数组中满了18岁的person提取出来，并封装到新数组中返回
         function getAdult(arr){
            // 创建新数组装载满18的person
            var newArr=[];
            // 遍历srr，获取arr中所有person对象
            for(var i=0;i<arr.length;i++){
                var p=arr[i];
                // 判断age是否大于等于18
                if (p.age>=18) {
                    newArr.push(p);
                }
            }

            // 如果大于等于18，则将对象添加到newArr中

            return newArr;
         }
         var result=getAdult(perArr);
         console.log(result);
    </script>

数组去重练习

    <script>
    //去除数组中的重复数字
        var arr = [1,2,3,2,2,1,3,4,2,5];
        for(var i=0; i<arr.length ;i++){
            var p = arr[i];
           // 获取当前元素后的所有元素
           for(var j=i+1;j<arr.length;j++){
              if (arr[i]==arr[j]) {
                arr.splice(j,1);
                j--;//当删除当前j所在元素后，后面元素会自动补位，此时不会再比较这个元素，这时需要j--再一次和原先位置做比较
              }
           }
        }
        console.log(arr);
    </script>

42.Date对象

在JS中使用Date对象来表示时间

        //输出当前时间
        var d = new Date();
        console.log(d);

        // 输出指定时间
        // 需要在构造函数中传递一个表示时间的字符串作为参数，格式：月份/日/年 时：分：秒
        var d2 = new Date("7/18/2022 11:25:46");
        console.log(d2);

getDate()获取当前对象中的日期是几日

var date = d2.getDate();

getDay()获取当前对象中的日期是周几（0周日—6周六）

var date = d2.getDay();

getMonth获取月份(0一月—11十二月)

var date2 = d2.getMonth();

getFullYear()从对象以四位数字返回年份

var date3 = d2.getFullYear();

getTime获取当前对象日期的时间戳
时间戳：从格林威治标准时间的1970年1月1日，0时0分0秒到当前对象中日期所花费的毫秒数（1秒=1000毫秒），用于计算机底层保存时间

var time = d2.getTime();
// 获取当前时间的时间戳
time = Date.now();

43.Math

Math 不是构造函数。Math 的所有属性/方法都可以通过使用 Math 作为对象来调用，而无需创建它
abs(x) 返回 x 的绝对值
sqrt(x) 返回 x 的平方根
sign(x) 返回数的符号（检查它是正数、负数还是零）

        alert(Math.abs(-9));
        // 生成一个x-y之间的随机数
        Math.round(Math.random()*(y-x)+x);
        var max = Math.max(10,20,30);
        Math.pow(x,y)
    </script>

44.包装类

在JS中提供了三个包装类，通过这三个包装类可以将基本数据类型转换为对象
除了 null 和 undefined之外，所有基本类型都有其对应的包装对象

步骤

根据对象保存的基本类型值，创建对应类型的实例对象
在这个实例上调用我们所指定的方法
立即销毁这个实例

45.字符串的方法

字符串在底层是以字符数组的形式保存的

var str = ["hello world"];
// 保存形式为["h","i"]
console.log(str[0]);
返回"h"

charAt() 返回在指定位置的字符
charCodeAt() 返回在指定的位置的字符的 Unicode 编码
fromCharCode() 从字符编码创建一个字符串
indexOf() 检索字符串
concat() 连接字符串
substring() 提取字符串中两个指定的索引号之间的字符
split() 把字符串分割为字符串数组

        str = "hello world";
        var result = str.charAt(4);
        var result = str.charCodeAt(4);
        result = String.fromCharCode(72);
        result = str.concat("hi");
        result = str.indexOf("o");//重复内容返回第一个位置，没有该内容返回-1
        result = str.indexOf("o",6);//可以指定为位置开始查找
        result = str.slice(0,5);
        result = str.substring(1,2);//类似slice，但该方法不支持负值，负值默认当做0，而且substring会自动调整参数位置，如果第二个参数小于第一个，则自动交换
        result = str.split("o");//需要一个字符串作为参数，会根据该字符串去拆分
        alert(result);

46.正则表达式

正则表达式用于定义一些字符串的规则，计算机可以根据正则表达式检查字符串是否符合规则，提取符合规则的字符串
语法：var 变量 = new RegExp（"正则表达式","匹配模式"）；
匹配模式：i 忽略大小写； g 全局匹配模式

        var reg = new RegExp("a");//检查字符串是否含有a
        var str = "bajjs"
        // test()用来检查字符串是否符合正则表达式规则
        var result = reg.test(str);
        // true
        //只要含有a都返回true

字面量创建正则表达式
语法： 变量 = /正则表达式/匹配模式

        reg = /a/i;
        
        reg = /a|b/;//a或b
        reg = /[ab]/;// a或b
        reg = /a-z/;//a到z的任意小写字母
        // 相同元素可以合并
        reg = /a[bde]c/;// abc或adc或aec

        // /[^ ]/除了
        reg = /[^ab]/;// 除了a和b都是true

47.字符串和正则相关方法

search 检索与正则表达式相匹配的值

stringObject.search(regexp)
//该参数可以是需要在 stringObject 中检索的子串，也可以是需要检索的 RegExp 对象

//返回值
//stringObject 中第一个与 regexp 相匹配的子串的起始位置。
//注释：如果没有找到任何匹配的子串，则返回 -1

/*search() 方法不执行全局匹配，它将忽略标志 g。它同时忽略 regexp 的 lastIndex 属性，并且总是从字符串的开始进行检索，这意味着它总是返回 stringObject 的第一个匹配的位置*/

match 找到一个或多个正则表达式的匹配

stringObject.match(searchvalue)//searchvalue	必需。规定要检索的字符串值
stringObject.match(regexp)//必需。规定要匹配的模式的 RegExp 对象。如果该参数不是 RegExp 对象，则需要首先把它传递给 RegExp 构造函数，将其转换为 RegExp 对象

replace 替换与正则表达式匹配的子串

stringObject.replace(regexp/substr,replacement)
/*regexp/substr	必需。规定子字符串或要替换的模式的 RegExp 对象。请注意，如果该值是一个字符串，则将它作为要检索的直接量文本模式，而不是首先被转换为 RegExp 对象。

replacement	必需。一个字符串值。规定了替换文本或生成替换文本的函数*/
/*返回值
一个新的字符串，是用 replacement 替换了 regexp 的第一次匹配或所有匹配之后得到的*/

split 把字符串分割为字符串数组

stringObject.split(separator,howmany)
/*separator	必需。字符串或正则表达式，从该参数指定的地方分割 stringObject。
howmany	可选。该参数可指定返回的数组的最大长度。如果设置了该参数，返回的子串不会多于这个参数指定的数组。如果没有设置该参数，整个字符串都会被分割，不考虑它的长度*/

/*返回值
一个字符串数组。该数组是通过在 separator 指定的边界处将字符串 stringObject 分割成子串创建的。返回的数组中的字串不包括 separator 自身。

但是，如果 separator 是包含子表达式的正则表达式，那么返回的数组中包括与这些子表达式匹配的字串（但不包括与整个正则表达式匹配的文本*/

48.正则语法

量词

通过量词可以设置一个内容出现的次数
（量词只对它前面的一个内容起作用）

        var reg = /a{3}/;//aaa
        var reg = /ab{3}/;//abbb
        var reg = /(ab){3}/;//ababab
        var reg = /a{0,}/;//a出现0次及以上

     {n}正好出现n次
     {m,n}出现n-m次
     {m,}出现m次及以上
     +至少一个，相当于{1，}
     *0个或多个，相当于{0，}
     ?0个或1个，相当于{0，1}
     ^表示开头
     &表示结尾
     如果在正则表达式中同时使用^ &，则必须要求字符串完全符合正则表达式
     .表示任意字符
      在正则表达式中使用\作为转义字符
      \.表示.
      \\表示\

识别电话号码

第一位必须是1 (1^)
第二位是3-9任意数字 [3-9]
第三位是任意9个数字 [0-9]{9}$

var phoneStr=/^1[3-9][0-9]{9}$/

创建一个正则表达式检查字符串中是否含有child

reg = /\bchild\b/;

去掉字符串中的前后空格

使用“ ”来替换空格

        //去除开头的空格
        str = str.replace(/\s/g , "");
        //去除结尾的空格
        str = str.replace( /^\s* / ,"");
        //匹配开头和结尾的空格
        str = str.replace( /\s*$/ ,"");
        /^\s*|\s*$/g