00-自己封装一些方法
const WZB = {
/* -------------------------- 数组相关函数的封装 -------------------------- */
wzbArray: {
// 封装函数：冒泡排序(从小到大排序)
getMyArrayMinToMax: function (arr) {
for (let i = 0; i < arr.length; i++) {
for (let j = 0; j < arr.length - (i + 1); j++) {
if (arr[j] > arr[j + 1]) {
const temp = arr[j]
arr[j] = arr[j + 1]
arr[j + 1] = temp
}
}
}
return arr
},
// 封装函数：冒泡排序(从大到小排序)
getMyArrayMaxToMin: function (arr) {
for (let i = 0; i < arr.length; i++) {
for (let j = 0; j < arr.length - (i + 1); j++) {
if (arr[j] < arr[j + 1]) {
const temp = arr[j]
arr[j] = arr[j + 1]
arr[j + 1] = temp
}
}
}
return arr
},
// 封装函数：数组去重函数
getMyArrayRemoveRepeat: function (arr) {
const newArr = []
for (let i = 0; i < arr.length; i++) {
let isRepeat = true
for (let j = 0; j < newArr.length; j++) {
if (newArr[j] === arr[i]) {
isRepeat = false
break
}
}
if (isRepeat) {
newArr.push(arr[i])
}
}
arr = newArr
return arr
},
// 封装函数：求数组中元素的最大值
getMyArrayMax: function (arr) {
let max = arr[0]
for (let i = 0; i < arr.length; i++) {
if (arr[i] > max) {
max = arr[i]
}
}
return max
},
// 封装函数：求数组中元素的最小值
getMyArrayMin: function (arr) {
let min = arr[0]
for (let i = 0; i < arr.length; i++) {
if (arr[i] < min) {
min = arr[i]
}
}
return min
},
// 封装函数：求数组中所有元素的和
getMyArraySum: function (arr) {
let sum = 0
for (let i = 0; i < arr.length; i++) {
sum += arr[i]
}
return sum
},
// 封装函数：求数组中所有元素的平均值
getMyArrayAvg: function (arr) {
let sum = 0
for (let i = 0; i < arr.length; i++) {
sum += arr[i]
}
return sum / arr.length
},
// 封装函数：反转一个数组中所有的元素
getMyArrayReverse: function (arr) {
const newArr = []
for (let i = 0; i < arr.length; i++) {
newArr.unshift(arr[i])
}
arr = newArr
return arr
}
},
/* -------------------------- 数字相关函数的封装 -------------------------- */
wzbNumber: {
// 封装函数：交换两个变量的值
getVarExchange: function (num1, num2) {
const temp = num1
num1 = num2
num2 = temp
return [num1, num2]
},
// 自定义范围的随机数
getRandom: function (min, max) {
return Math.floor(Math.random() * (max - min + 1) + min)
}
}
}01-封装函数：冒泡排序（从小到大排序）
// 封装函数：冒泡排序(从小到大排序)
function getMyArrayMinToMax (arr) {
for (let i = 0; i < arr.length; i++) {
for (let j = 0; j < arr.length - (i + 1); j++) {
if (arr[j] > arr[j + 1]) {
const temp = arr[j]
arr[j] = arr[j + 1]
arr[j + 1] = temp
}
}
}
return arr
}02-封装函数：冒泡排序(从大到小排序)
// 封装函数：冒泡排序(从大到小排序)
function getMyArrayMaxToMin (arr) {
for (let i = 0; i < arr.length; i++) {
for (let j = 0; j < arr.length - (i + 1); j++) {
if (arr[j] < arr[j + 1]) {
const temp = arr[j]
arr[j] = arr[j + 1]
arr[j + 1] = temp
}
}
}
return arr
}03-封装函数：数组去重函数
// 封装函数：数组去重函数
function getMyArrayRemoveRepeat (arr) {
const newArr = []
for (let i = 0; i < arr.length; i++) {
let isRepeat = true
for (let j = 0; j < newArr.length; j++) {
if (newArr[j] === arr[i]) {
isRepeat = false
break
}
}
if (isRepeat) {
newArr.push(arr[i])
}
}
arr = newArr
return arr
}
04-封装函数：求数组中元素的最大值
// 封装函数：求数组中元素的最大值
function getMyArrayMax (arr) {
let max = arr[0]
for (let i = 0; i < arr.length; i++) {
if (arr[i] > max) {
max = arr[i]
}
}
return max
}
05-封装函数：求数组中元素的最小值
// 封装函数：求数组中元素的最小值
function getMyArrayMin (arr) {
let min = arr[0]
for (let i = 0; i < arr.length; i++) {
if (arr[i] < min) {
min = arr[i]
}
}
return min
}
06-封装函数：求数组中所有元素的和
// 封装函数：求数组中所有元素的和
function getArraySum (arr) {
let sum = 0
for (let i = 0; i < arr.length; i++) {
sum += arr[i]
}
return sum
}
07-封装函数：求数组中所有元素的平均值
// 封装函数：求数组中所有元素的平均值
function getMyArrayAvg (arr) {
let sum = 0
for (let i = 0; i < arr.length; i++) {
sum += arr[i]
}
return sum / arr.length
}
08-封装函数：反转一个数组中所有的元素
// 封装函数：反转一个数组中所有的元素
function getMyArrayReverse (arr) {
const newAyy = []
for (let i = 0; i < arr.length; i++) {
newAyy.unshift(arr[i])
}
arr = newAyy
return arr
}
09-封装函数：交换两个变量的值
// 封装函数：交换两个变量的值
function getVarExchange (num1, num2) {
const temp = num1
num1 = num2
num2 = temp
return [num1, num2]
}
01-js书写位置
内部式
<script>
alert('内部式：努力，奋斗')
</script>外部式
<script src="./index.js"></script>alert('外部式：努力，奋斗')内联式
<div class="box" onclick="alert('内联式：努力，奋斗')"></div>02-输入输出
01-输入
// 输入语句
prompt('请输入您的名字：')02-输出
// 在页面中输出语句
document.write('我是在页面中书写的文字')
// 用控制台输出信息
console.log('我是控制台输出的信息');
// 用弹出框输出信息
alert('我是弹出框输出的信息')03-变量
概念
变量是用于存放数据的容器本质
变量是程序在内存中申请的一块用来存放数据的空间
一个变量被重新复赋值后，它原有的值就会被覆盖命名规范
1. 由字母(A-Za-z)、数字(0-9)、下划线(_)、美元符号( $ )组成
2. 严格区分大小写
3. 不能以数字开头
4. 不能是关键字和保留字
5. 变量名必须有意义
6. 遵守驼峰命名法注意点
1. 变量只声明，不赋值，类型为Undefined
2. 变量未声明，直接使用，会报错
3. 变量未声明，直接赋值后使用，不会报错，但不推荐使用
4. 声明变量推荐使用 let，不推荐使用 var
5. 不允许用 let 声明同一个变量多次，var 可以，但不推荐使用示例代码
// 声明变量
let age;
// 变量的赋值
age = 18;
// 变量的初始化
let sum = 100;
// 多个变量的声明
let stuName, stuAge, stuScore
// 多个变量的初始化
let stuName = '夏明', stuAge = 19, stuScore = 99.504-数据类型
分类:
简单数据类型(基本数据类型): Number, String, Boolean, Undefined, Null
复杂数据类型: object
说明: 只有初始化了的变量才有数据类型，只声明没赋值的变量没有数据类型数字类型（Number）
说明: 可以用来保存整数和小数
默认值: 0
判断变量是否为非数字:
API: isNaN(参数)
参数: 如果参数是数字型，则返回值为false；如果参数不是数字型，则返回值为true // 声明一个变量
let num;
// 查看数据类型
console.log(typeof num); // undefined
// 初始化一个变量
let num = 100;
// 查看数据类型
console.log('数据类型：' + typeof num); // number
// 获取数字型的最大值
console.log('数字型的最大值：' + Number.MAX_VALUE); // 1.7976931348623157e+308
// 获取数字型的最小值
console.log('数字型的最小值：' + Number.MIN_VALUE); // 5e-324
// 无穷大值
console.log(Number.MAX_VALUE * 2); // Infinity
// 无穷小值
console.log(-Number.MIN_VALUE * 2); // -Infinity
// 非数字
console.log('你好' * 10); // NaN
// 初始化变量
let age = 20;
let username = 'pink';
// 查看变量是否为非数字
console.log(isNaN(age)); // false
console.log(isNaN(username)); // true字符串类型（String）
说明: 用双引号或单引号包裹的内容就是字符串型数据
引号使用规则: 外双内单 / 外单内双
常用字符串转义符: \n 换行 \t tab缩进 \b 一个空格 \\ 一个\ \' 一个' \" 一个"
获取字符串的长度:
属性: length
说明: 获取的是引号内所有字符的总数
使用方法: 字符串变量.length
返回值: 是一个整数
字符串的拼接:
连接符: +
拼接规则: 字符串 + 任何类型 = 拼接之后的新字符串
口诀: 数值相加，字符相连 // 初始化字符串型变量
let str = 'pink';
console.log('str:\n' + str);
let username = "王泽滨";
console.log('username:\n' + username);
let info = "我是\t'黑马程序员学员'";
console.log('info:' + info);
let msg = '我是\t"黑马程序员学员"';
console.log('msg:' + msg);
// 获取字符串的长度
let addr = '中华人民共和国 北京市 顺义区 黑马程序员培训中心';
console.log(addr.length); // 25
// 字符串的拼接
console.log('pink' + ' ' + '老师'); // pink 老师
console.log(100 + '10'); // 10010
console.log('' + 10 + 10); // 1010
console.log(10 + 10 + ''); // 字符串型的20
console.log(10 + 10); // 数字型的20布尔类型（Boolean）
// 说明: 用于逻辑判断
// 取值: true 真，数学运算时变为1参与计算 / false 假，数学运算时变为0参与计算
// 注意: false、null、undefined、’’（空字符串）、0、NaN 都会被转换为false，其他的都是true
let flag1 = true;
let flag0 = false;
console.log(flag1 + 10); // 11
console.log(flag0 + 10); // 10未定义类型（Undefined）
// 说明: 当一个变量声明了但没赋值，或者赋值为undefined，返回值都是undefined
let age;
console.log(age); // undefined
let addr = undefined;
console.log(addr); // undefined
// undefined 与数字相加
console.log(addr + 100); // NaN
// undefined 与字符串拼接
console.log(addr + 'pink老师'); // undefinedpink老师
// undefined 与布尔值相加
console.log(addr + true); // NaN空类型（Null）
// 说明: 当给一个变量赋值为null时，返回值为null，意为空值（什么都没有）
let uname = null;
console.log(uname); // null
// null 与字符串拼接
console.log(uname + 'pink'); // nullpink
// null 与数字相加
console.log(uname + 10); // 10
// null 与undefined相加
console.log(uname + undefined); // NaN
// null 与布尔类型相加
console.log(uname + true); // 1检测变量的数据类型
// 用法: typeof 变量或字面量或表达式
// 返回值: 是对应的数据类型（number、string、boolean、undefined、object）中的一种
console.log(typeof 10); // number
console.log(typeof 'pink'); // string
console.log(typeof true); // boolean
console.log(typeof undefined); // undefined
console.log(typeof null); // object
console.log(typeof 'pink' * 10); // NaN数据类型的转换
-
其它类型转换为字符串类型
// 方式一: 变量.toString() // 方式二: String(变量) // 方式三: 变量 + '' 是隐式转换 let num = 100; console.log(num.toString()); console.log(String(num)); console.log(num + ''); let flag = true; console.log(flag.toString()); console.log(String(flag)); console.log(flag + ''); -
其它类型转换为数字类型
// 方式一: parseInt(参数)，参数为字符串类型或布尔类型，获取的是整数，不会四舍五入 // 方式二: parseFloat(参数)，参数为字符串类型或布尔类型，获取的是小数，不会四舍五入 // 方式三: Number(参数)，参数为字符串类型或布尔类型，获取的是数字，不会四舍五入 // 方式四: 参数 - 0， 参数 * 1， 参数 / 1，参数为字符串类型或布尔类型，获取的是数字，不会四舍五入 // parseInt() console.log(parseInt('100')); // 100 console.log(parseInt('3.14')); // 3 console.log(parseInt('3.94')); // 3 console.log(parseInt('120px')); // 120 console.log(parseInt('pink120px')); // NaN console.log(parseInt(true)); // NaN // parseFloat() console.log(parseFloat('100')); // 100 console.log(parseFloat('3.14')); // 3.14 console.log(parseFloat('3.94')); // 3.94 console.log(parseFloat('120px')); // 120 console.log(parseFloat('pink120px')); // NaN console.log(parseFloat(true)); // NaN // Number() console.log(Number('100')); // 100 console.log(Number('3.14')); // 3.14 console.log(Number('3.94')); // 3.94 console.log(Number('120px')); // NaN console.log(Number('pink120px')); // NaN console.log(Number(true)); // 1 // - * / console.log('100' - 0); // 100 console.log('100' - '80'); // 20 console.log(true - 0); // 1 console.log('3.14' * 1); // 3.14 console.log('20' * '5'); // 100 console.log('3.14' / 1); // 3.14 console.log('120px' / 1); // NaN console.log('10' / '5'); // 2 -
其它类型转换为布尔类型
// 用法: Boolean(参数) // 参数: 代表空或否定意义的都转换为false，代表非空或肯定意义的都转换为true console.log(Boolean('')); // false console.log(Boolean(0)); // false console.log(Boolean(null)); // false console.log(Boolean(undefined)); // false console.log(Boolean(NaN)); // false console.log(Boolean(1)); // true console.log(Boolean('1')); // true console.log(Boolean('你好')); // true // 其余的都是 true
05-运算符
运算符分类
-
算数运算符：
+ - * / % -
一元运算符：
++ -- ! -
关系运算符：
> >= < <= -
相等运算符：== != === !==
-
逻辑运算符：
&& || & | ! -
赋值运算符：
= += -= *= /= %= -
三元运算符：
? :
运算符优先级
| 优先级 | 运算符 | 顺序 |
|---|---|---|
| 1 | 小括号 | () |
| 2 | 一元运算符 | ++ -- ! |
| 3 | 算数运算符 | 先 * / 后 + - |
| 4 | 关系运算符 | > >= < <= |
| 5 | 相等运算符 | == != === !== |
| 6 | 逻辑运算符 | 先 && 后 || |
| 7 | 赋值运算符 | = |
| 8 | 逗号运算符 | , |
06-流程控制
顺序流程控制
没有特定的语法结构，程序会按照代码的先后顺序，依次执行分支流程控制
根据不同的条件，执行不同的路径代码（执行代码多选一的过程），从而得到不同的结果
- if 单分支语句
- if-else 双分支语句
- if-else-if-else-if-else 多层分支语句
- switch-case-default 多分支语句循环流程控制
规律性的重复执行某些操作，直到循环条件不满足后就结束
- for 循环：确定循环次数的时候用
- while 循环：不确定循环次数，只知道循环条件时用
- do-while 循环：不确定循环次数，只知道循环条件，并且至少要执行一次循环时用07-数组
定义
数组是指一组数据的集合，其中的每个数据被称作元素，在数组中可以存放任意类型的元素创建数组
- 利用 new 创建数组：let arr = new Array();
- 利用数组字面量创建数组：let arr = ['小白','小黑','大黄','瑞奇'];数组的索引 (下标)
用来访问数组元素的序号（数组下标从 0 开始）
可以通过“数组名[索引]”的形式来获取数组中的元素：arr[1]遍历数组
// 就是把数组中的每个元素从头到尾都访问一次
let arr = ['red','green', 'blue'];
for(let i = 0; i < arr.length; i++){
console.log(arrStus[i]);
}数组的长度
是可读写的
- 获取：arr.length;
- 修改：arr.length = 8;
通过修改数组索引新增数组元素：arr[4] = 'hotpink';数组API
给数组末尾添加元素
/*
1. push() 用于给数组末尾添加新元素
2. push() 参数直接写要添加的数组元素就可以，多个参数之间用逗号隔开
3. push() 返回值是添加元素后数组的长度值
4. push() 添加元素后原数组也会发生变化
*/
var arr1 = ['red', 'green']
arr1.push('pink') // 添加一个元素
var resPush = arr1.push('purple', 'blue') // 添加多个元素
给数组开头添加元素
/*
1. unshift() 用于给数组开头添加新元素
2. unshift() 参数直接写要添加的数组元素就可以，多个参数之间用逗号隔开
3. unshift() 返回值是添加元素后数组的长度值
4. unshift() 添加元素后原数组也会发生变化
*/
var arr2 = ['red', 'green']
arr2.unshift('pink') // 添加一个元素
var resUnshift = arr2.unshift('yellow', 'black') // 添加多个元素
删除数组最后一个元素
/*
1. pop() 用于删除数组最后一个元素
2. pop() 无参数
3. pop() 返回值是被删除的那个数组元素
4. pop() 删除元素后原数组也会发生变化
*/
var arr3 = ['red', 'green']
var resPop = arr3.pop()
删除数组开头的一个元素
/*
1. shift() 用于删除数组开头的一个元素
2. shift() 无参数
3. shift() 返回值是被删除的那个数组元素
4. shift() 删除元素后原数组也会发生变化
*/
var arr4 = ['red', 'green']
var resShift = arr4.shift()
从前向后查找，获取第一个指定数组元素的索引值
/*
1. indexOf() 从前向后查找，用于获取找到的第一个指定数组元素的索引值
2. indexOf() 参数是要获取索引值的那一个数组元素
3. indexOf() 若数组中没有要获取的元素，则返回值是-1
*/
var arr4 = ['red', 'green', 'pink', 'yellow', 'pink', 'blue']
var resIndexOf = arr4.indexOf('pink')
从后向前查找，获取第一个指定数组元素的索引值
/*
1. lastIndexOf() 从后向前查找，用于获取找到的第一个指定数组元素的索引值
2. lastIndexOf() 参数是要获取索引值的那一个数组元素
3. lastIndexOf() 若数组中没有要获取的元素，则返回值是-1
*/
var resLastIndexOf = arr4.lastIndexOf('pink')
封装数组元素去重函数
function uniqueArr (arr) {
var newArr = []
for (var i = 0; i < arr.length; i++) {
if (newArr.indexOf(arr[i]) === -1) {
newArr.push(arr[i])
}
}
return newArr
}
数组转换为字符串
var colorArr = ['red', 'green', 'blue', 'pink', 'pink', 'green'];
console.log('数组转换为字符串：', colorArr.toString());
console.log('join()方式：', colorArr.join()); // 默认以逗号分隔
console.log('join()方式：', colorArr.join('&')); // 指定&分隔符连接数组
/*
1. concat() 用于连接两个数组
2. concat() 无参数
3. concat() 返回值是一个新组成的数组
4. concat() 不会影响原数组
*/
var arrAB = arrA.concat(arrB)
截取数组(留前不留后)
/*
1. slice() 截取指定范围的数组
2. slice() 留前不留后
3. slice() 参数有两个，第一个参数是从哪个索引开始截取，第二个参数是截取到哪个索引位置
4. slice() 返回值是截取的那个子数组
5. slice() 不会影响原数组
*/
var arrSlice = arrA.slice(2, 5);删除指定范围的数组(留前不留后)
/*
1. splice() 删除指定范围的数组
2. splice() 留前不留后
3. splice() 参数有两个，第一个参数是从哪个索引开始删除，第二个参数是要删除的总长度
4. splice() 返回值是删除的那个“子数组”
5. splice() 会影响原数组
*/
var arrSplice = arrA.splice(1, 4); // [2, 3, 4, 5]数组反转
var arr000 = ['中国红', '天空蓝', '浪花白', '葱叶绿'];
var arrReverse = arr000.reverse();数组排序
var numArr = [3, 6, 4, 9, 0, 1, 8, 2];
var arrSort = numArr.sort();
console.log('从小到大排序后的数组是：', arrSort);
console.log('从大到小排序后的数组是：', arrSort.reverse());统计一个数组中相同的元素出现的索引位置和次数
// 1. 定义一个数组
var arr = ['red', 'green', 'blue', 'red', 'yellow', 'red', 'green', 'red', 'red']
// 2. 查找 'red' 第一次出现的索引
var index = arr.indexOf('red')
// 3. 定义统计次数
var count = 0
// 4. 循环查找
while (index !== -1) {
console.log(index) // 输出索引
count++ // 次数累加
index = arr.indexOf('red', index + 1) // 继续向后查找
}
// 5. 输出
console.log('出现的次数是：', count)
筛选出数组中小于20的数组元素，放入一个新数组
var numArr1 = [20, 11, 15, 2, 14, 9, 100, 97, 65, 48, 99]
var newArr = []
for (var i = 0; i < numArr1.length; i++) {
if (numArr1[i] <= 20) {
newArr[newArr.length] = numArr1[i]
}
}
console.log('小于20的数组元素组成的新数组是：', newArr)
console.log('翻转数组：', newArr.reverse())
08-函数
定义
就是封装了一段可被重复调用执行的代码块函数的两种声明方式
自定义函数方式（命名函数）
利用函数关键字 function 自定义函数方式
function fn() {
...
}
fn(); // 此时调用函数的代码既可以放到声明函数的前面，也可以放在声明函数的后面函数表达式方式（匿名函数）
利用变量和函数关键字 function 自定义函数方式
let fn = function(){
...
};
fn(); // 此时函数调用的代码必须写到函数体后面函数的参数
形参
在声明函数时，可以在函数名称后面的小括号中添加的一些参数，默认值是`undefined`实参
在调用该函数时，同样也需要传递相应的参数，这些参数被称为实参参数的作用
在函数内部某些值不能固定，我们可以通过参数在调用函数时传递不同的值进去
// 带参数的函数声明
function fn(param1, param2, param3,...) { // 可以定义任意多的参数，用逗号分隔
...
}
// 带参数的函数调用
fn(10, 20, 30,...);函数形参和实参个数不匹配问题
| 参数个数 | 说明 |
|---|---|
实参个数 == 形参个数 | 输出正确结果 |
实参个数 >= 形参个数 | 只取到形参的个数，其余的被忽略 |
实参个数 <= 形参个数 | 多出来的形参是undefined类型的，结果为NaN |
函数的返回值
// 声明函数
function fn() {
...
return 需要返回的值; // 此时函数返回所需的结果后会退出函数的执行
}
// 调用函数
fn(); // 此时调用函数就可以得到函数体内 return 后面的值
如果函数没有`return` ，返回的值是`undefined`break、continue、return 的区别
- break：结束当前的循环体（如 for、while）
- continue：跳出本次循环，继续执行下次循环（如 for、while）
- return：不仅可以退出循环，还能够返回 return 语句中的值，同时还可以结束当前的函数体内的代码09-对象
arguments 内置对象
存储了函数传递的所有实参，展示形式是一个伪数组
- 具有`length`属性
- 按索引方式储存数据
- 不具有数组的`push()`，`pop()` 等方法10-作用域
全局作用域
作用于所有代码执行的环境(整个 `script` 标签内部)或者一个独立的 `js` 文件局部作用域（函数作用域）
作用于函数内的代码环境，因为跟函数有关系，所以也称为函数作用域变量的作用域
全局变量
在全局作用域下声明的变量叫做全局变量（在函数外部定义的变量）
- 全局变量在代码的任何位置都可以使用
- 在全局作用域下 `let` 声明的变量 是全局变量
- 特殊情况下，在函数内不使用 `let` 声明的变量也是全局变量（不建议使用）局部变量
在局部作用域下声明的变量叫做局部变量（在函数内部定义的变量）
- 局部变量只能在该函数内部使用
- 在函数内部 `let` 声明的变量是局部变量
- 函数的形参实际上就是局部变量全局变量和局部变量的区别
- 全局变量：在任何一个地方都可以使用，只有在浏览器关闭时才会被销毁，因此比较占内存
- 局部变量：只在函数内部使用，当其所在的代码块被执行时，会被初始化；当代码块运行结束后，就会被销毁，因此更节省内存空间作用域链
- 根据在内部函数可以访问外部函数变量的这种机制，用链式查找决定哪些数据能被内部函数访问
- 采取 **就近原则** 的方式来查找变量最终的值 11-Math对象
封装自己的数学对象
const myMath = {
// 圆周率
PI: 3.141592653,
// 最大值
max: function () {
let max = arguments[0]
for (let i = 0; i < arguments.length; i++) {
if (arguments[i] > max) {
max = arguments[i]
}
}
return max
},
// 最小值
min: function () {
let min = arguments[0]
for (let i = 0; i < arguments.length; i++) {
if (arguments[i] < min) {
min = arguments[i]
}
}
return min
},
// 自定义范围的随机数
getRandom: function (min, max) {
return Math.floor(Math.random() * (max - min + 1)) + min
}
}
console.log('自定义函数求最大值：', myMath.max(10, 100, 50, 30))
console.log('自定义函数求最小值：', myMath.min(10, 100, 50, 30))
console.log('自定义函数求圆周率：', myMath.PI)
console.log('获取随机数：', myMath.getRandom(10, 100))
获取圆周率
console.log(Math.PI); // 3.141592653589793获取最大值
console.log(Math.max()); // -Infinity
console.log(Math.max(10, 11, 9)); // 11
console.log(Math.max(-1, 0, -15)); // 0
console.log(Math.max(1, 3, 'pink老师')); // NaN获取最小值
console.log(Math.min()); // Infinity
console.log(Math.min(10, 11, 9)); // 11
console.log(Math.min(-1, 0, -15)); // 0
console.log(Math.min(1, 3, 'pink老师')); // NaN获取绝对值
console.log(Math.abs(10)); // 10
console.log(Math.abs(-10)); // 10
console.log(Math.abs('-200')); // 200
console.log(Math.abs('pink老师')); // NaN小数取整
// 向下取整
console.log(Math.floor(1.1)) // 1
console.log(Math.floor(1.9)) // 1
console.log(Math.floor('100')) // 100
console.log(Math.floor('pink老师')) // NaN
// 向上取整
console.log(Math.ceil(1.1)) // 2
console.log(Math.ceil(1.9)) // 2
console.log(Math.ceil('100')) // 100
console.log(Math.ceil('pink老师')) // NaN
// 四舍五入
console.log(Math.round(1.4)) // 1
console.log(Math.round(1.5)) // 2
console.log(Math.round(1.6)) // 2
console.log(Math.round(1.9)) // 2
console.log(Math.round(-1.4)) // -1
console.log(Math.round(-1.5)) // -1
console.log(Math.round(-1.6)) // -2
console.log(Math.round('1.8')) // 2
console.log(Math.round('pink老师')) // NaN
获取随机数
// 默认随机数[0, 1)
console.log(Math.random()) // 例：0.2891317964225615
// 自定义范围内的随机整数(不含最大值)[min, max)
// 公式：Math.floor(Math.random() * (max - min)) + min
console.log(Math.floor(Math.random() * (5 - 1)) + 1) // 例：4
// 自定义范围内的随机整数(含最大值)[min, max]
// 公式：Math.floor(Math.random() * (max - min + 1)) + min
console.log(Math.floor(Math.random() * (5 - 1 + 1)) + 1) // 例：5
12-日期对象
定义日期对象
let date = new Date();获取当前系统时间
console.log(new Date()); // 例：Wed Sep 08 2021 10:18:02 GMT+0800 (中国标准时间)获取指定的日期时间
console.log(new Date('2020-10-10 08:08:08')); // 例：Sat Oct 10 2020 08:08:08 GMT+0800 (中国标准时间)获取年份
console.log('年：', date.getFullYear()); // 例：2021获取月份
console.log('月：', date.getMonth() + 1); // 例：9获取天数
console.log('号：', date.getDate()); // 例：8获取周数
console.log('周几：', date.getDay()); // 例：3获取小时数
console.log('小时数：', date.getHours()); // 例：10获取分钟数
console.log('分钟数：', date.getMinutes()); // 例：30获取秒数
console.log('秒数：', date.getSeconds()); // 例：50封装一个格式化日期时间的函数
function myGetDateTime (strDateTime) {
// 定义一个日期对象，传入指定格式的字符串的日期时间
const date = new Date(strDateTime)
// 获取年
const year = date.getFullYear()
// 获取月
let month = date.getMonth() + 1
month = month < 10 ? '0' + month : month
// 获取日
let day = date.getDate()
day = day < 10 ? '0' + day : day
// 获取小时数
let hour = date.getHours()
hour = hour < 10 ? '0' + hour : hour
// 获取分钟数
let minute = date.getMinutes()
minute = minute < 10 ? '0' + minute : minute
// 获取秒数
let seconds = date.getSeconds()
seconds = seconds < 10 ? '0' + seconds : seconds
// 获取周
let weekday
const weekArr = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六']
for (let i = 0; i < weekArr.length; i++) {
weekday = weekArr[date.getDay()]
}
// 返回值
return year + '年' + month + '月' + day + '日 ' + hour + '点' + minute + '分' + seconds + '秒 ' + weekday
}
// 调用自定义封装的函数，获取当前日期时间
console.log(myGetDateTime('2021-10-08 03:03:03'))
获取当前时间距离 1970.1.1 时间的总毫秒数
console.log('获取当前时间距离 1970.1.1 时间的总毫秒数：', new Date().valueOf());
console.log('获取当前时间距离 1970.1.1 时间的总毫秒数：', new Date().getTime());
console.log('获取当前时间距离 1970.1.1 时间的总毫秒数(最常用)：', +new Date());
console.log('获取当前时间距离 1970.1.1 时间的总毫秒数：', Date.now());获取指定时间距离 1970.1.1 时间的总毫秒数
console.log('获取指定时间距离 1970.1.1 时间的总毫秒数：', +new Date('2020-09-09 09:08:08'));倒计时案例
function downTime (strDate) {
// 获取总毫秒数
const currentTime = +new Date() // 当前时间
const userTime = +new Date(strDate) // 用户传过来的时间
const total = userTime - currentTime
console.log(total)
// 获取秒数
const seconds = parseInt(total / 1000)
console.log(seconds)
// 获取天数
const d = parseInt(seconds / 60 / 60 / 24)
console.log(d)
// 获取小时数
const h = parseInt(seconds / 60 / 60 % 24)
console.log(h)
// 获取分钟数
const m = parseInt(seconds / 60 % 60)
console.log(m)
// 获取秒数
const s = parseInt(seconds % 60)
console.log(s)
// 返回值
return d + '天' + h + '点' + m + '分' + s + '秒'
}
// 执行倒计时函数
const time = downTime('2022-10-08 03:03:03')
console.log(time)13-数组对象
给数组末尾添加元素
/*
给数组末尾添加元素
1. push() 用于给数组末尾添加新元素
2. push() 参数直接写要添加的数组元素就可以，多个参数之间用逗号隔开
3. push() 返回值是添加元素后数组的长度值
4. push() 添加元素后原数组也会发生变化
*/
console.log('给数组末尾添加元素：');
let arr1 = ['red', 'green'];
console.log('\t原数组是：', arr1, '\t数组长度是：', arr1.length);
arr1.push('pink'); // 添加一个元素
let resPush = arr1.push('purple', 'blue'); // 添加多个元素
console.log('\t现数组是：', arr1, '\t数组长度是：', resPush);给数组开头添加元素
/*
给数组开头添加元素
1. unshift() 用于给数组开头添加新元素
2. unshift() 参数直接写要添加的数组元素就可以，多个参数之间用逗号隔开
3. unshift() 返回值是添加元素后数组的长度值
4. unshift() 添加元素后原数组也会发生变化
*/
console.log('给数组开头添加元素：');
let arr2 = ['red', 'green'];
console.log('\t原数组是：', arr2, '\t数组长度是：', arr2.length);
arr2.unshift('pink'); // 添加一个元素
let resUnshift = arr2.unshift('yellow', 'black'); // 添加多个元素
console.log('\t现数组是：', arr2, '\t数组长度是：', resUnshift);删除数组最后一个元素
/*
删除数组最后一个元素
1. pop() 用于删除数组最后一个元素
2. pop() 无参数
3. pop() 返回值是被删除的那个数组元素
4. pop() 删除元素后原数组也会发生变化
*/
console.log('删除数组最后一个元素：');
let arr3 = ['red', 'green'];
console.log('\t原数组是：', arr3, '\t数组长度是：', arr3.length);
let resPop = arr3.pop();
console.log('\t现数组是：', arr3, '\t被删除的元素是：', resPop);删除数组开头的一个元素
/*
删除数组开头的一个元素
1. shift() 用于删除数组开头的一个元素
2. shift() 无参数
3. shift() 返回值是被删除的那个数组元素
4. shift() 删除元素后原数组也会发生变化
*/
console.log('删除数组开头的元素：');
let arr4 = ['red', 'green'];
console.log('\t原数组是：', arr4, '\t数组长度是：', arr4.length);
let resShift = arr4.shift();
console.log('\t现数组是：', arr4, '\t被删除的元素是：', resShift);从前向后查找，获取第一个指定数组元素的索引值
/*
从前向后查找，获取第一个指定数组元素的索引值
1. indexOf() 从前向后查找，用于获取找到的第一个指定数组元素的索引值
2. indexOf() 参数是要获取索引值的那一个数组元素
3. indexOf() 若数组中没有要获取的元素，则返回值是-1
*/
let resIndexOf = arr4.indexOf('pink');
console.log('从前向后查找，获取找到的第一个指定数组元素的索引值：', resIndexOf);从后向前查找，获取第一个指定数组元素的索引值
/*
从后向前查找，获取第一个指定数组元素的索引值
1. lastIndexOf() 从后向前查找，用于获取找到的第一个指定数组元素的索引值
2. lastIndexOf() 参数是要获取索引值的那一个数组元素
3. lastIndexOf() 若数组中没有要获取的元素，则返回值是-1
*/
let resLastIndexOf = arr4.lastIndexOf('pink');
console.log('从后向前查找，获取找到的第一个指定数组元素的索引值：', resLastIndexOf);封装数组元素去重函数
// 定义原数组
const arr00 = ['red', 'green', 'blue', 'pink', 'pink', 'pink', 'green', 'red', 'red', 'red', 'black']
console.log('原数组是：', arr00)
// 封装函数
function uniqueArr (arr) {
const newArr = []
for (let i = 0; i < arr.length; i++) {
if (newArr.indexOf(arr[i]) === -1) {
newArr.push(arr[i])
}
}
return newArr
}
// 调用函数
const myArr = uniqueArr(arr00)
console.log('去重后的数组是：', myArr)将数组转换为字符串
let colorArr = ['red', 'green', 'blue', 'pink', 'pink', 'green'];
// toString()方式，只能以逗号进行分隔
console.log('数组转换为字符串：', colorArr.toString());
// join()方式，可以自定义分隔符
console.log('join()方式：', colorArr.join()); // 默认以逗号分隔
console.log('join()方式：', colorArr.join('&')); // 指定&分隔符连接数组
// 定义数组
let arrA = [1, 2, 3, 4, 5, 6];
let arrB = [10, 20, 30, 40];
/*
连接数组
1. concat() 用于连接两个数组
2. concat() 无参数
3. concat() 返回值是一个新组成的数组
4. concat() 不会影响原数组
*/
let arrAB = arrA.concat(arrB);
console.log('连接后的数组是：', arrAB); // [1, 2, 3, 4, 5, 6, 10, 20, 30, 40]截取数组(留前不留后)
// 定义数组
let arr = [1, 2, 3, 4, 5, 6];
/*
截取数组(留前不留后)
1. slice() 截取指定范围的数组
2. slice() 留前不留后
3. slice() 参数有两个，第一个参数是从哪个索引开始截取，第二个参数是截取到哪个索引位置
4. slice() 返回值是截取的那个子数组
5. slice() 不会影响原数组
*/
let arrSlice = arr.slice(2, 5);
console.log('截取数组(留前不留后)：', arrSlice); // [3, 4, 5]删除指定范围的数组(留前不留后)
// 定义数组
let arr = [1, 2, 3, 4, 5, 6];
/*
删除指定范围的数组(留前不留后)
1. splice() 删除指定范围的数组
2. splice() 留前不留后
3. splice() 参数有两个，第一个参数是从哪个索引开始删除，第二个参数是要删除的总长度
4. splice() 返回值是删除的那个“子数组”
5. splice() 会影响原数组
*/
let arrSplice = arr.splice(1, 4); // [2, 3, 4, 5]
console.log('删除指定范围的数组(留前不留后)：', arrSplice);反转数组
// 定义数组
let arr000 = ['中国红', '天空蓝', '浪花白', '葱叶绿'];
console.log('原数组是：', arr000); // ["中国红", "天空蓝", "浪花白", "葱叶绿"]
let arrReverse = arr000.reverse();
console.log('反转后的数组是：', arrReverse); // ["葱叶绿", "浪花白", "天空蓝", "中国红"]数组排序
// 定义数组
let numArr = [3, 6, 4, 9, 0, 1, 8, 2];
console.log('原数组是：', numArr); // [3, 6, 4, 9, 0, 1, 8, 2]
let arrSort = numArr.sort();
console.log('从小到大排序后的数组是：', arrSort); // [0, 1, 2, 3, 4, 6, 8, 9]
console.log('从大到小排序后的数组是：', arrSort.reverse()); // [9, 8, 6, 4, 3, 2, 1, 0]遍历数组, 无返回值
let nums = [1, 2, 3, 4, 3 ,3];
console.log('原数组：', nums);
nums.forEach(function (item, index, arr) {
console.log(item, index, arr);
});
console.log(nums);遍历数组, 必须全部都满足条件才为true
let nums = [1, 2, 3, 4, 3 ,3];
console.log('原数组：', nums);
let every = nums.every(function (item) {
return item > 0;
});
console.log(every); // true遍历数组, 只要有一个满足条件就返回true
let nums = [1, 2, 3, 4, 3 ,3];
console.log('原数组：', nums);
let some = nums.some(function (item) {
return item > 3;
});
console.log(some); // true遍历数组, 把满足条件的所有值返回, 组成一个新数组
let nums = [1, 2, 3, 4, 3 ,3];
console.log('原数组：', nums);
let filter = nums.filter(function (item) {
return item > 2;
});
console.log(filter);遍历数组, 同步操作数组中每一个元素, 返回一个新数组
let nums = [1, 2, 3, 4, 3 ,3];
console.log('原数组：', nums);
let map = nums.map(function (item) {
return item * 2;
});
console.log(map);遍历数组, 用于查找满足条件的第一个数组元素, 并返回它
let nums = [1, 2, 3, 4, 3 ,3];
console.log('原数组：', nums);
let find = nums.find(function (item) {
return item > 2;
});
console.log(find);遍历数组, 用于查找满足条件的第一个数组元素的索引, 并返回它
let nums = [1, 2, 3, 4, 3 ,3];
console.log('原数组：', nums);
let findIndex = nums.findIndex(function (item) {
return item > 2;
});
console.log(findIndex);14-字符串对象
根据字符返回索引位置
// 定义一个字符串
let str1 = '冬天即将来临，春天还会远吗？';
let indexOf1 = str1.indexOf('天');
console.log('根据字符返回索引位置：', indexOf1); // 1
let indexOf2 = str1.indexOf('天', 2);
console.log('根据字符返回索引位置：', indexOf2); // 8
let lastIndexOf1 = str1.lastIndexOf('天');
console.log('根据字符返回索引位置：', lastIndexOf1); // 8
let lastIndexOf2 = str1.lastIndexOf('天', 2);
console.log('根据字符返回索引位置：', lastIndexOf2); // 1根据位置返回对应的字符
// 定义一个字符串
let str1 = '冬天即将来临，春天还会远吗？';
let char1 = str1.charAt(3);
console.log('根据位置返回对应的字符：', char1); // 将根据位置返回对应字符的 ASCII 码
// 定义一个字符串
let str1 = '冬天即将来临，春天还会远吗？';
let charCode = str1.charCodeAt(3);
console.log('根据位置返回对应字符的 ASCII 码：', charCode); // 23558H5 新增的方法：根据位置返回对应字符
// 定义一个字符串
let str1 = '冬天即将来临，春天还会远吗？';
let charStr = str1[3];
console.log('H5 新增的方法：', charStr);统计一个字符串中相同字符出现的索引位置和次数
// 1. 定义一个字符串
let str = 'abcdaaahgayauuaoaalkaaf';
// 2. 获取 'a' 第一次出现的位置
let index = str.indexOf('a');
// 3. 定义统计次数
let count = 0;
// 4. 循环查找
while (index !== -1) {
console.log(index);
count++;
index = str.indexOf('a', index + 1);
}
// 5. 输出结果
console.log('出现的总次数是：', count);连接字符串
// 定义三个字符串
let strA = 'Hello';
let strB = 'World';
let strC = '!!!';
let strAB = strA.concat(strB);
console.log('连接两个字符串：', strAB); // HelloWorld
let strABC = strA.concat(strB, strC);
console.log('连接多个字符串：', strABC); // HelloWorld!!!截取字符串(从指定位置开始截取指定长度)
// 定义一个字符串
let strA = 'Hello';
let substr = strA.substr(1, 3);
console.log('截取字符串(从指定位置开始截取指定长度)：', substr); // ell截取字符串(从指定位置开始到指定位置结束)
// 定义一个字符串
let strA = 'Hello';
let slice = strA.slice(1, 4);
console.log('截取字符串(从指定位置开始到指定位置结束)：', slice); // ell截取字符串(从指定位置开始到指定位置结束，可用负值)
// 定义一个字符串
let strA = 'Hello';
let _slice = strA.slice(-3, -1);
console.log('截取字符串(从指定位置开始到指定位置结束，可用负值)：', _slice); // ll截取字符串(从指定位置开始到指定位置结束，不支持负值)
// 定义一个字符串
let strA = 'Hello';
let substring = strA.substring(0, 3);
console.log('截取字符串(从指定位置开始到指定位置结束，不支持负值)：', substring); // Hel替换字符串中指定的第一个字符
let strMain = 'HelloWorld';
let replace = strMain.replace('o', '*');
console.log('替换字符串中指定的字符：', replace);替换字符串中指定的所有相同的字符
// 方式一：replaceAll() 方法
let strMain = 'HelloWorld';
let replaceAll = strMain.replaceAll('l', '*');
console.log('替换字符串中指定的字符：', replaceAll); // He**oWor*d
// 方式二：循环方式
while (strMain.indexOf('l') !== -1) {
strMain = strMain.replace('l', '*');
}
console.log('替换字符串中指定的所有相同的字符：', strMain); // He**oWor*d根据指定字符分割字符串
let str0 = 'hello everyone, my name is wzb, thanks!';
console.log('根据空格分割：', str0.split(' ')); // ["hello", "everyone,", "my", "name", "is", "wzb,", "thanks!"]
console.log('根据逗号分割：', str0.split(',')); // ["hello everyone", " my name is wzb", " thanks!"]把字符串中所有字母全部转换为大写
let str01 = 'abcDeFghijkl';
let toUpperCase = str01.toUpperCase();
console.log('把字符串中所有字母全部转换为大写：', toUpperCase); // ABCDEFGHIJKL把字符串中所有字母全部转换为小写
let str01 = 'abcDeFghijkl';
let toLowerCase = str01.toLowerCase();
console.log('把字符串中所有字母全部转换为小写：', toLowerCase); // abcdefghijkl把字符串中首尾所有空格去除
let str01 = ' abcDe Fgh ijkl ';
let trim = str01.trim();
console.log('把字符串中首尾所有空格去除：', trim); // abcDe Fgh ijkl判断字符串以什么字符串开头
let str01 = 'abcDeFghijkl';
let startsWith = str01.startsWith('ab');
console.log('判断字符串以什么字符串开头：', startsWith); // true判断字符串以什么字符串结尾
let str01 = 'abcDeFghijkl';
let endsWith = str01.endsWith('ab');
console.log('判断字符串以什么字符串结尾：', endsWith); // false
8万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
