记录JS学习-CSDN博客

本文链接：https://blog.csdn.net/xiayngbaidu12345/article/details/123620988

数据类型

<script>
    //typeof获取基本数据类型
    //基本数据类型有String,Number,Boolean,Null,Undefined
    //引用数据类型有Object,Array,Function

    var a=1;
    var b='hello';
    var c;
    var d=true;
    var e=new Array(1,2,3);
    var f={
       name:'lisi',
       age:12
    }
    var g=function(){

    }
    console.log(typeof a);//Number
    console.log(typeof b);//String
    console.log(typeof c);//Undefined
    console.log(typeof d);//Boolean
    console.log(typeof e);//Object,理由:object - 如果变量是⼀种引⽤类型或 Null 类型的 如： new Array()/ new String()...,如果要判断是不是数组类型，可以使用instanceof
    console.log(e instanceof Array);//true
    console.log(typeof f);//Object
    console.log(typeof g);//Function

    //进制转换
    //R进制到10进制输出
    console.log(10);//10进制-->10
    console.log(0b10);//2进制-->2
    console.log(0o10);//8进制-->8
    console.log(0x10);//16进制-->16
    //10进制转换成R进制
    var x=101
    console.log(x.toString(2));//1100101
    console.log(x.toString(8));//145
    console.log(x.toString(16));//65
    //R进制转换成10进制
    var y=101
    console.log(parseInt(y,2));//5
    console.log(parseInt(y,8));//65
    console.log(parseInt(y,16));//257

    //类型转换
    //强制类型转换,在数值的前面加上Number,String,Boolean,还可以使用parseInt(),parseFloat()
    console.log(String(null));//null
    console.log(String(100+23));//123
    console.log(String([1,2]));//1,2
    console.log(Number(3.14));//3.14
    console.log(parseInt(3.14));//3
    console.log(parseFloat('3.14abc'));//3/14

    //isNaN()检测参数是否不是⼀个数字
    console.log(isNaN(3));//false,是一个数字
    console.log(isNaN('abc'));//true,不是一个数字
</script>

数组

//JS的内置对象
   //数组

   //创建数组
   var a=new Array();//创建一个空数组
   console.log(a);//Array[]
   console.log(a.length);//0
   var b=new Array(10);//创建一个长度为10的数组
   console.log(b);//Array[10]不过每个单元都为空
   console.log(b.length);//10
   var c=new Array(10,20,30)//创建⼀个指定数组单元的数组
   console.log(c);//Array[3] [10,20,30]
   console.log(c.length);//3
   var d=[1,2,3];//快捷定义数组
   console.log(d);//Array[3] [1,2,3]
   console.log(d.length);//3

   //Array常用方法
   //toString将数组转化为字符串
    var e=['a','b','c'];
    console.log(e.toString());//a,b,c

    //sort函数按照字符串顺序对值进行排序
    var f=[3,2,1];
    console.log(f.sort());//Array[3] [1,2,3]

    //join把数组所有元素放入一个字符串，并根据指定的分隔符进行分离
    console.log(e.join('--'));//a--b--c

    //pop删除数组尾部最后一个元素,并返回这个元素
    var g=[1,2,3,4,5];
    console.log("pop前"+g);//pop前1,2,3,4,5
    console.log(g.pop());//5
    console.log("pop后"+g);//pop后1,2,3,4
    //push向数组尾部添加一个或多个元素,并返回数组的新长度
    console.log('push前'+g);//push前1,2,3,4,5
    console.log(g.push(6,7));//7
    console.log('push后'+g);//push后1,2,3,4,5,6,7
    //shift取出数组首部中的第⼀个元素,并返回这个数
    console.log('shift前'+g);//shift前1,2,3,4,5
    console.log(g.shift());//1
    console.log('shift后'+g);//shift后2,3,4,5
    //unshift在数组首部插⼊项，返回数组的⻓度
    console.log('unshift前'+g);//unshift前1,2,3,4,5
    console.log(g.unshift(-1,0));//7
    console.log('unshift后'+g);//unshift后-1,0,1,2,3,4,5
    //splice向数组任意位置添加元素或者删除元素，splice(第一个参数，第二个参数，其余元素...),第一个参数定义了应添加新元素的位置,第二个参数定义应删除多少元素,其余参数定义要添加的新元素。当第二个元素为0，其余元素存在，则为添加;当第二个元素不为0,其余元素不存在，则为删除。
    //通过splice向数组添加元素
    console.log('splice添加前'+g);//splice添加前1,2,3,4,5
    console.log(g.splice(2,0,0,0));//Array []
    console.log('splice添加后'+g);//splice添加后1,2,0,0,3,4,5
    //通过splice从数组删除元素
    console.log('splice删除前'+g);//splice删除前1,2,3,4,5
    console.log(g.splice(2,1));//返回删除项的数组
    console.log('splice删除后'+g);//splice删除后1,2,4,5

   // concat数组合并过合并（连接）现有数组来创建一个新数组，不会更改现有数组。它总是返回一个新数组
    var parent=['dad','mom'];
    var child=['son','daughter'];
    var family=parent.concat(child);
    console.log(parent);//Array [ "dad", "mom" ]
    console.log(child);//Array [ "son", "daughter" ]
    console.log(family);//Array(4) [ "dad", "mom", "son", "daughter" ]

    //slice剪裁数组,用数组的某个片段切出新数组,不影响现有数组,slice(第一个参数，第二个参数),第一个参数表示从这个位置开始删(包含这里的元素),第二个参数表示删到这个位置为止(不包括这里的元素),如果没有第二个参数，则一删到底
    var fruit=['apple','orange','lemon','pear'];
    console.log('删除前'+fruit);//删除前apple,orange,lemon,pear
    console.log(fruit.slice(1,3));//Array [ "orange", "lemon" ]
    console.log('删除后'+fruit);//删除后apple,orange,lemon,pear
    
    //reverse 翻转数组,会影响数组
    console.log('翻转前'+fruit);//翻转前apple,orange,lemon,pear
    console.log(fruit.reverse());//Array(4) [ "pear", "lemon", "orange", "apple" ]
    console.log('翻转后'+fruit);//翻转后pear,lemon,orange,apple
    
   //排序对象数组
   var cars = [
                {type:"Volvo", year:2016},
                {type:"Saab", year:2001},
                {type:"BMW", year:2010}];
  cars.sort(function(a, b){return a.year - b.year});//BMW 2017
                                                   //Audi 2019
                                                   //porsche2018   

  //数组遍历，寻找元素，indexOf() 方法在数组中搜索元素值并返回其位置。如果未找到项目, Array.indexOf() 返回 -1。如果项目多次出现，则返回第一次出现的位置。
  var fruits = ["Apple", "Orange", "Apple", "Mango"];
  var a = fruits.indexOf("Apple");  //0

对于数组内置函数sort()进行说明，默认地，sort() 函数按照字符串顺序对值进行排序。
该函数很适合字符串（“Apple” 会排在 “Banana” 之前）。
不过，如果数字按照字符串来排序，则 “25” 大于 “100”，因为 “2” 大于 “1”。正因如此，sort() 方法在对数值排序时会产生不正确的结果。
为此在数值排序时,我们采用比值函数与sort搭配一起用，具体为：

//正序
var points = [40, 100, 1, 5, 25, 10];
points.sort(function(a, b){return a - b}); 

//逆序
points.sort(function(a, b){return b - a});

接下来，对比值函数进行解释：
比较函数的目的是定义另一种排序顺序。比较函数应该返回一个负，零或正值，这取决于参数：

function(a, b){return a-b}

当 sort() 函数比较两个值时，会将值发送到比较函数，并根据所返回的值（负、零或正值）对这些值进行排序。
实例：当比较 40 和 100 时，sort() 方法会调用比较函数 function(40,100)。该函数计算 40-100，然后返回 -60（负值）。排序函数将把 40 排序为比 100 更低的值。

Date

//Date
   var dd=new Date();
   console.log(dd);//Date Mon Mar 21 2022 14:20:45 GMT+0800 (中国标准时间)

   //getDate()从Date对象返回一个月的某一天(1~31),注意:不是随机的一天，是日期在哪一天,就返回哪一天
   console.log(dd.getDate());//21

   //getDay()从 Date 对象返回⼀周中的某⼀天 (0 ~ 6)。0可以认为是星期天
   console.log(dd.getDay());//1

   //getMonth() 从 Date 对象返回⽉份 (0 ~ 11)。要返回真正月份的时候，记得给+1，要不然就比真正的月份少一个月
   console.log(dd.getMonth()+1);//3

   //getFullYear() 从 Date 对象以四位数字返回年份。
   console.log(dd.getFullYear());//2022

   //getHours() 返回 Date 对象的⼩时 (0 ~ 23)。
   console.log(dd.getHours());//14

  //getMinutes() 返回 Date 对象的分钟 (0 ~ 59)。
   console.log(dd.getMinutes());//18

  //getSeconds() 返回 Date 对象的秒数 (0 ~ 59)。
  console.log(dd.getSeconds());//43  

 //getTime() 返回 1970 年 1 ⽉ 1 ⽇⾄今的毫秒数。
 console.log(dd.getTime());//1647843645660

String

//String方法
   var str = "The full name of China is the People's Republic of China.";

   //indexOf() 方法返回字符串中指定文本首次出现的索引（位置）,如果未找到文本,indexOf() 和 lastIndexOf() 均返回 -1。两种方法都接受作为检索起始位置的第二个参数。
   console.log(str.indexOf('China'));//17

   //lastIndexOf() 方法返回指定文本在字符串中最后一次出现的索引,lastIndexOf() 方法向后进行检索（从尾到头）
   console.log(str.lastIndexOf('China'));//51

   //slice()提取字符串的某个部分并在新字符串中返回被提取的部分。该方法设置两个参数：起始索引（开始位置），终止索引（结束位置）。包括开始位置的字符，但不包括结束位置的字符.如果省略第二个参数，则该方法将裁剪字符串的剩余部分：
   var str1 = "Apple, Banana, Mango";
   var res = str1.slice(7,13);
   console.log(res);//Banana
   console.log(str1);//Apple, Banana, Mango

   //substr()类似于slice()。不同之处在于第二个参数规定被提取部分的长度。如果省略第二个参数，则该 substr() 将裁剪字符串的剩余部分
   var res2=str1.substr(7,4);
   console.log(res2);//Bana
   console.log(str1);//Apple, Banana, Mango

   //replace()方法用另一个值替换在字符串中指定的值,replace() 方法不会改变调用它的字符串。它返回的是新字符串。默认地，replace() 只替换首个匹配.
   var str3='hello world!';
   var res3=str3.replace('world','Js');
   console.log(res3);//hello Js!
   console.log(str3);//hello world!
   //如果想要全局替换，则可以使用正则表达式
   var str4='Please visit Microsoft and Microsoft!';
   var res4=str4.replace(/Microsoft/g,'W3School');
   console.log(res4);//Please visit W3School and W3School!

   //toUpperCase() 把字符串转换为大写
   var text1 = "Hello World!";
   var text2 = text1.toUpperCase();
   console.log(text2);//HELLO WORLD!
   console.log(text1);//Hello World!

   //toLowerCase() 把字符串转换为小写
   var text3=text2.toLowerCase();
   console.log(text3);//hello world!

   //concat()连接两个或多个字符串
    var text1 = "Hello";
    var text2 = "World";
    text3 = text1.concat(text2);
    console.log(text3);//HelloWorld

    //trim() 方法删除字符串两端的空白符
    var str = "       Hello World!        ";
    console.log('trim()方法:'+str.trim());//trim()方法:Hello World!
    console.log('replace方法:'+str.replace(/ /g,''));//replace方法:HelloWorld!
    console.log('replace完善:'+str.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, ''));//replace完善:Hello World!

    //charAt() 返回在指定位置的字符
    var str5='hello';
    console.log(str5.charAt(1));//e

    //split() 将字符串转换为数组
    var txt = "a,b,c,d,e";
    console.log(txt.split());//Array [ "a,b,c,d,e" ] 0: "a,b,c,d,e"  length: 1
    console.log(txt.split(""));//Array(9) [ "a", ",", "b", ",", "c", ",", "d", ",", "e" ]
                                // 0: "a"
                                // 
                                // 1: ","
                                // 
                                // 2: "b"
                                // 
                                // 3: ","
                                // 
                                // 4: "c"
                                // 
                                // 5: ","
                                // 
                                // 6: "d"
                                // 
                                // 7: ","
                                // 
                                // 8: "e"
                                // 
                                // length: 9
    console.log(txt.split(","));//Array(5) [ "a", "b", "c", "d", "e" ]
                                // 0: "a"
                                // 
                                // 1: "b"
                                // 
                                // 2: "c"
                                // 
                                // 3: "d"
                                // 
                                // 4: "e"
                                // 
                                // length: 5

Math

//math

   //max()
   var x=6,y=8;
   console.log(Math.max(x,y));//8

   //Math.pow(x, y) 的返回值是 x 的 y 次幂
   console.log(Math.pow(2,3));//8

   //Math.sqrt(x) 返回 x 的平方根
   console.log(Math.sqrt(81));//9

   //Math.abs(x) 返回 x 的绝对（正）值
   console.log(Math.abs(-1));//1

   //Math.random() 返回介于 0（包括） 与 1（不包括） 之间的随机数
   console.log(Math.random());//0.5647683835588184
   console.log(Math.random());//0.3802664548573568
   //Math.random() 与 Math.floor() 一起使用用于返回随机整数。
   console.log(Math.floor(Math.random()*10)); 返回 0 至 9 之间的数
   console.log(Math.floor(Math.random()*11)); 返回 0 至 10 之间的数