JavaScript知识点简单总结

proud1212

已于 2022-07-13 19:33:40 修改

阅读量209

点赞数

文章标签： javascript 前端开发语言

于 2022-07-13 19:07:37 首次发布

本文链接：https://blog.csdn.net/weixin_44309299/article/details/125770594

版权

循环

while 循环
while (条件){
循环操作；
}
特点：先判断，再执行
do-while 循环
do{
循环操作；
}while(循环条件);
特点：先执行，再判断
for循环
for(初始化变量；循环条件；变量更新 ){
循环操作;
}

特点：先判断，再执行
初始化变量 —> 循环条件(true) —> 循环操作 —>更新变量

内置对象

数学对象

Math.PI 圆周率
Math.floor（参数）向下取整
返回一个小于或等于参数的证书
Math.ceil（参数）向上取整
返回一个大于或等于参数的整数
Math.round（参数）四舍五入取整
Math.max（数值1，数值2，数值3.。。。）
返回一组数里的较大值
Math.min（数值1，数值2，数值3.。。。）
返回一组数里的较小值
Math.abs（参数）取绝对值
Math.pow（想x，y）
返回x的y次方
Math.random（）
返回一个0-1之间的数字

日期对象

获取var mydate = new Date()

mydate.toLocaleDateString()
根据本地时间把 Date 对象的日期部分转换为字符串，并返回结果
mydate.toLocaleTimeString()
根据本地时间把 Date 对象的时间部分转换为字符串，并返回结果
mydate.toLocaleString()
根据本地时间把 Date 对象的日期与时间部分转换为字符串，并返回结果
mydate.getFullYear() 获取年份
mydate.getMonth() 获取月份 0-11
0–>1月份 1–>2月份
mydate.getDate() 获取日期
mydate.getHours() 获取小时
mydate.getMinutes() 获取分钟
mydate.getSeconds() 获取秒
mydate.getMilliseconds() 获取毫秒
mydate.getDay() 获取星期 0-6
0–>星期日 1–>星期一
mydate.getTime() 获取距离1970年1月1日的毫秒数

设置var mydate = new Date(“yyyy/mm/dd hh:mm:ss”)

mydate.setFullYear(yyyy) 设置年份
mydate.setMonth(mm) 设置月份 0-11
0–>1月份 1–>2月份
mydate.setDate(dd) 设置日期
mydate.setHours(hh) 设置小时
mydate.setMinutes(mm) 设置分钟
mydate.setSeconds(ss) 设置秒
mydate.setMilliseconds(ms) 设置毫秒
mydate.setTime(tt) 设置距离1970年1月1日的毫秒数

字符串对象

创建字符串

构建函数
var str = newString（）；
字面量
var str = ‘字符串’

属性

strObj.length 字符串长度
字符串索引 [0 , strObj .length -1]

方法

strObj .indexOf(参数1 ，参数2)
从参数2位置开始检索参数1子串，在整个字符串中第一次出现的位置
参数1：必须检索的字符
参数2 ：可选开始查找的位置若省略从0开始
返回值数字【-1 ，字符串长度-1】
若检索到字符串，返回该字符串所在位置的索引，若查不到返回-1
strObj .lastIndexOf(参数1 ，参数2)
从参数2位置开始检索参数1子串，在整个字符串中最后一次出现的位置
strObj .replace(参数1 ，参数2)
用参数2替换参数1
参数1：必须被替换的字符串或正则表达式 /正则/g g全局匹配
参数2：必须用来替换参数1
strObj.substr(参数1 , 参数2)
从参数开始截取长度为从参数2的子串
参数1；必须写开始位置可为负 -1倒数第一个字符 -2倒数第二个字符
参数2 ；可选截取长度若省略截取到整个字符末尾
返回值：截取到的子串
strObj.substring(参数1 , 参数2)
从参数1（包含参数1位置的字符）开始截取到参数2（不包含参数2位子字符）的子串
参数1；必须写开始位置不可为负
参数2 ；可选结束截取位置若省略截取到整个字符末尾
返回值：截取到的子串
- 概要
  参数1位置截取，参数2位置不截取
  当参数1 == 参数2 ，截取空字符
  当参数1 > 参数2 ，截取前先交换位置
strObj.slice(参数1 , 参数2)
从参数1（包含参数1位置的字符）开始截取到参数2（不包含参数2位子字符）的子串
参数1；必须写开始位置可为负
参数2 ；可选结束截取位置若省略截取到整个字符末尾
返回值：截取到的子串
- 注意点
  参数1位置截取，参数2位置不截取
strObj.charAt(索引号)
根据索引号查询子串
strObj.charCodeAt(索引号)
根据索引号返回字符对应的编码
strObj.toLowerCase()转换为小写字母
strObj.toUpperCase()转换为大写字母
strObj.split(参数1 ，参数2)
参数1：必须写分隔符
参数2：可选分割分数
返回值数组
strObj.match(参数)
参数：正则表达式
返回值：返回匹配结果构成的数组或null（匹配失败）
strObj.trim() 删除字符串左、右空格
strObj.trimLeft()删除左侧空格
strObj.trimRight()

数组对象

创建

构造函数
var arr=new Arr();
arr [0]=10; 在数组内部添加元素
arr[1]=1;
arr[5]=5; 数组长度为6
var arr=new Arr(10,7);
var arr=new Arr(4);
创建了一个长度为4的数组
字面量
var arr=[ ];
var arr=[1,2,3 ];

属性

arrObj.length 获取数组长度
[0,arrObj.length-1]

方法

遍历
arrObj.forEach(function(item,index,arr){
item 遍历的数组的每个元素
index 当前遍历元素的索引
arr 数组
})
过滤
arr.obj.filter(function(total,item,index,arr){
total 初始值的返回值
return 返回值；
})
数组中的每个值（从左到右）开始缩减，最终计算为一个值
迭代
arrObj.reduce(function(total , item,index,arr){
total 初始值或函数的返回值
return 返回值;
},初始值);
数组中的每个值（从左到右）开始缩减，最终计算为一个值
映射
arrObj.map(function(item,index,arr){
return item * 2
});
返回一个新数组，数组中的元素为原始数组元素调用函数处理后的值。
删除
arrObj.pop( ) 删除数组最后一个元素
arrObj.shift( ) 删除数组da第一个元素
返回值：删除的元素
添加
arrObj.push(元素1，元素2) 尾部添加元素
arrObj.unshift(元素1，元素2) 头部添加元素
返回值：新数组的长度
排序
arrObj.sort(参数)
参数：可选函数若省略，按字符编码的升序排序
函数里形参的相对顺序来决定按照升序还是降序排列
arrObj.sort(function(a,b){
return a-b；//升序
return b-a；//降序
})
返回值：排序后的数组
颠倒
arrObj.reverse()
链接数组
arrObj.concat(参数)
参数：必需待连接的的数组或元素多个数组或元素用逗号隔开
返回值：连接后的数组
分割
arrObj.join(参数) 数组分割为字符串
参数：可选分隔符若省略默认用逗号隔开
返回值：字符串
删除与添加
arrObj.splice(参数1，参数2，参数3)
从参数1 的位置开始删除参数2 个元素，并在参数1 位置添加参数 3 里的元素
参数1：必选开始删除的位置
参数2：必选删除元素的个数
参数3：可选添加的元素，多个元素之间用逗号隔开
返回值：删除的元素组成的数组
拷贝
arrObj.copyWithin(参数1，参数2，参数3)
用于从数组的指定位置拷贝元素到数组的另一个位置中
参数１：必需，复制到指定目标索引位置
参数２：可选，元素复制的起始位置
参数３：可选，停止复制的索引位置 (默认为 array.length)。如果为负值，表示倒数
返回值：数组
arrObj.every(function(参数1，参数2，参数3){
return 条件；
});
用于检测数组所有元素是否符合指定条件（通过函数提供）
如果所有元素都满足条件，返回true
如果数组中检测到有一个元素不满足，返回false，且剩余的元素不会再检测
参数1 ：必需，当前元素的值
参数2：可选，当前元素的索引值
参数3：可选，当前元素属于的数组对象
arrObj.some(function(item,i,arr){
return 条件;
});
用于检测数组所有元素是否都符合指定条件（通过函数提供）
如果所有元素都不满足条件，则返回 false
如果数组中检测到有一个元素满足条件，则整个表达式返回 true，且剩余的元素不会再进行检测
返回值：布尔值
arrObj.find(function(item,i){
return 条件;
});
返回第一个满足条件的元素，如果无满足条件的元素，返回undefined
arrObj.findIndex(function(item,i){
return 条件;
});
返回第一个满足条件元素的位置(索引)，如果无满足条件的元素，返回-1
Array.isArray(参数) 判断参数是否是数组如果是数组，返回true，否则返回false
Array.from（参数1，参数2）
通过拥有length属性的对象或可迭代的对象来返回一个数组
参数1：必需转换为数组的对象
参数2：可选数组中的每个元素调用的函数
返回值：数组

正则对象

创建正则对象
构造函数
var reg=new RegExp(“正则表达式”，“修饰符”)
字面量
var reg=/正则表达式/修饰符
方括号
[0-9] 匹配数字0-9里的任意一个数字
[^0-9] 匹配除了0-9之外的其他的字符
[abc] 匹配字符a或b或c
[^abc] 匹配除字符a或b或c的其他字符
(red|blue|green) 匹配red blue green 的任何模式
[A-Z] 匹配A-Z的任何一个大写字母
[a-z] 匹配a-z的任何一个小写字母
[A-z] 匹配A-z的任何一个字符
元字符
\d 匹配数字0-9里的任何一个数字[0-9]
\D 匹配除0-9之外的其他字符非数字[^0-9]
\w 匹配字符A-Z或a-z或0-9或_字符[A-Za-z0-9_]
\W 匹配字符A-Z或a-z或0-9或_字符之外的其他字符[^A-Za-z0-9_]
\s 匹配空白符
\S 匹配除空白符之外的其他字符
. 查找单个字符，除了换行和结束符
量词
{m} 匹配前一项m次
{m , } 匹配前一项至少m次
{m , n} 匹配前一项至少m次，至多n次
^a 匹配任何开头为a的字符串
a$ 匹配任何结尾为a的字符串
* 匹配前一项0次或多次{0，}
+ 匹配前一项至少1次{1，}
？匹配前一项0次或1次{0，1}
正则对象方法
- regobj.test(参数)
  用于检测字符串是否匹配正则表达式
  参数：字符串
  返回值：布尔值
  如果字符匹配正则表达式返回true，否则返回false
- regObj.exec(参数)
  用于检测字符串是否匹配正则表达式
  参数：字符串
  返回值：数组/null
  如果字符匹配正则表达式返回true，否则返回false

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body></body>
  <script>
    // 1 - 10;
    // for (var i = 1; i <= 10; i++) {
    //   console.log(i);
    // }

    // for (var i = 0; i < 10; i++) {
    //   console.log(i + 1);
    // }

    // var str = "abcdef";
    // for (var i = 0; i < str.length; i++) {
    //   console.log(str[i]);
    // }

    // var arr = [10, 7, 1, 2, 19];
    // for (var i = 0; i < arr.length; i++) {
    //   console.log(i);
    //   console.log(arr[i]);
    // }

    // var arr = [2, 7, 2, 2, 1];
    // for (var i in arr) {
    //   console.log(i);//属性名  字符串
    //   console.log(arr[i]);
    // }

    // for (var item of arr) {
    //   console.log(item);
    // }

    // arr.forEach(function (item, i, array) {
    //   console.log(item);
    //   console.log(i);
    //   console.log(array);
    // });

    // var arr2 = arr.map(function (item, i, array) {
    //   return 2 * item;
    // });

    // var arr2 = arr.filter(function (item, i, array) {
    //   if (item % 2 === 0) {
    //     return true;
    //   }
    // });

    // var arr2 = arr.filter(function (item, i, array) {
    //   return item % 2 === 0;
    // });

    // 去重方法1
    // arr.filter(function(item,i){
    //     if(arr.indexOf(item) === i){
    //         return true;
    //     }
    // })

    // var arr2 = arr.filter(function (item, i) {
    //   return arr.indexOf(item) === i;
    // });

    // 去重方法2
    // var s = new Set(arr); //集合
    // var arr2 = Array.from(s);

    // 去重方法3
    // var arr2 = [];
    // for (var i = 0; i < arr.length; i++) {
    //   if (arr2.indexOf(arr[i]) === -1) {
    //     arr2.push(arr[i]);
    //   }
    // }

    // 去重方法4
    // for (var i = 0; i < arr.length; i++) {
    //   for (var j = i + 1; j < arr.length; j++) {
    //     if (arr[i] === arr[j]) {
    //       arr.splice(j, 1);
    //       j--;
    //     }
    //   }
    // }
    // console.log(arr);

    // var arr = [2, 7, 2, 2, 1];
    // var res = arr.reduce(function (total, item, i) {
    //   //   console.log(total);
    //   return total + item;
    // }, 0);
    // console.log(res);

    // 数组删除
    // console.log(arr.pop());
    // console.log(arr.shift());

    // 数组添加
    // console.log(arr.push("hello")); //返回新数组的长度
    // console.log(arr.unshift("hello")); //返回新数组的长度

    // console.log(arr.splice(0, 2, "abc", 100, 8));

    // var arr2 = arr.sort(function (a, b) {
    //   return a - b;
    //   return b - a;
    // });

    // 冒泡排序  冒泡排序的原理
    // for (var i = 0; i < arr.length - 1; i++) {
    //   for (var j = 0; j < arr.length - 1 - i; j++) {
    //     if (arr[j] > arr[j + 1]) {
    //       var temp = arr[j];
    //       arr[j] = arr[j + 1];
    //       arr[j + 1] = temp;
    //     }
    //   }
    // }

    // 反转数组
    // arr.reverse();

    // var str = arr.join("-");
    // var str = arr.join("");

    // 字符串反转
    // var str = "hello world!";
    // 把字符串转换为数组
    // var arr = str.split("");
    // 把数组进行反转
    // arr.reverse();
    // 把数组转换为字符串
    // str = arr.join("");
    // console.log(str); //反转后的字符串

    // 字符方法
    // var str = "hello4 world,6hello 2China";
    // var str = "小明:100;校花:80;小草:97;张三:101";
    // console.log(str.indexOf("o", 6));

    // str = str.replace("hello", "你好");
    // str = str.replace(/hello/g, "你好");
    // str = str.replace(/\d/g, "数");
    // var arr = str.match("hello");
    // var arr = str.match(/\d{2,}/g);
    // var res = arr.reduce(function (total, item) {
    //   return item * 1 + total;
    // }, 0);
    // console.log(arr);
    // console.log(res);

    // var str = "小明:100;校花:80;小草:97;张三:101";
    // 截取
    // console.log(str.substring(3, 6));
    // console.log(str.substr(3, 3));
    // console.log(str.startsWith("小明"));
    // console.log(str.endsWith("小明"));
    // console.log(str.includes("小明"));

    // strObj.substring(开始截取位置, 结束截取的位置);
    // strObj.substr(开始截取位置, 截取长度);
    // strObj.slice(开始截取位置, 结束截取的位置);

    // var arr = new Array(12,89);
    // console.log(arr);
    // arr.push(11);

    // function box() {
    //   console.log(this); //window
    // }
    // window.box();

    // 构造函数;
    // function Animal(name) {
    //   this.name = name;
    //   //   console.log(this);
    //   this.speak = function () {
    //     console.log("给大爷拿食物来");
    //   };
    // }

    // var b = new Animal("狗蛋"); //实例化对象
    // console.log(b);
    // console.log(b.name);
    // b.speak();

    // 工具类   静态方法
    // Math.max(3,8,2);
    // 一个数组里的较大值
    // var arr = [0, 9, 10, 7, 2];
    // console.log(Math.max.apply(null, arr));

    // 取整
    // 1.向上取整
    // Math.ceil(9.801);
    // Math.ceil(-9.801);

    // 2.向下取整
    // Math.floor(9.801);
    // Math.floor(-9.801);

    // 3.四舍五入取整
    // Math.round(8.911);

    // 随机数
    // Math.floor(Math.random() * 10); // [0,10)

    // Math.round(Math.random() * 10 + 5); // [5,15]
    // Math.floor(Math.random() * 11 + 5); // [5,15]

    // Math.pow(2,8)  // 2 ** 3

    // var mydate = new Date();
    // var mydate2 = new Date("2022/6/1 00:00:00");
    // var mils = mydate2 - mydate;
    // console.log(mils);
    // var d = parseInt(mils / 1000 / 60 / 60 / 24);
    // console.log(d);
    // var h = parseInt((mils / 1000 / 60 / 60) % 24);
    // var m = parseInt((mils / 1000 / 60) % 60);
    // var s = parseInt((mils / 1000) % 60);
    // console.log(s);

    // console.log(mydate);
    // console.log(mydate.toLocaleString());
    // console.log(mydate.toLocaleDateString());
    // console.log(mydate.toLocaleTimeString());
    // console.log(mydate.getFullYear());
    // console.log(mydate.getMonth() + 1);
    // console.log(mydate.getDate());
    // console.log(mydate.getDay());
    // console.log(mydate.getHours());
    // console.log(mydate.getMinutes());
    // console.log(mydate.getSeconds());
    // console.log(mydate.getTime()); //时间戳
    // console.log(Date.now());

    // 自定义对象
    // var obj = new Object();
    // obj.name = "甜心教主";
    // obj.gender = "女性";
    // obj.sing = function () {
    //   console.log("爱你");
    // };

    // var obj = {};
    // var obj = {
    //   name: "twins",
    //   sing: function () {
    //     console.log("莫斯科没有眼泪");
    //   },
    // };
    // console.log(obj);
    // obj.name
    // for (var i in obj) {
    //   //   console.log(i);
    //   console.log(obj[i]);
    // }

    // delete obj.name;

    // console.log(obj);

    // 缺点：对象不能复用
  </script>
</html>