JS内置对象之Math,Date,Aray及String部分属性及方法的整理及代码实践
对象概念：对象是一组无序的相关属性和方法的集合。指一个具体的事物，比如这个苹果。而构造函数泛指一大类，比如苹果。
JavaScript中对象分为3种：
自定义对象，内置对象，浏览器对象；前两种对象为JS基础内容，属于ECMAScript;浏览器对象属于JS独有。其中，内置对象是指JS语言自带的一些对象，这些对象供开发者使用，并提供一些常用的或最基本的而必要的功能（属性和方法）。内置对象的最大优点：帮助程序员快速开发。JS提供了多个内置对象：Math、Date、Array、String等。
遍历对象方法：
For in（主要用于对对象的属性进行循环操作）
示例：
var obj = {
name:'zmh',
age:18,
sex:'男'
}
for(var k in obj){
console.log(k)
console.log(obj[k])
}
其中k为对象属性名，obj[k]为对象属性值
当函数的传参个数不能确定时，可以不写传参，因为在函数内部arguments会接收调用该函数时传入的所有实参，并以数组的形式存储。Arguments[0]表示传入的第一个实参。
利用对象封装自己的数学函数，从一组数中选出最大的数或者最小的数：
var myMath = {
max:function(){
var max = arguments[0]
for(let i = 1;i < arguments.length;i++){
if(arguments[i] > max){
max = arguments[i]
}
}
return max
},
min:function(){
var min = arguments[0]
for(let i = 1;i < arguments.length;i++){
if(arguments[i] < min){
min = arguments[i]
}
}
return min
},
}
console.log('最大值',myMath.max(0,5,6,8,9))
console.log('最小值',myMath.min(0,5,6,8,9))
这也是将数值进行比较的底层原理。
一、JS中的内置对象Math:
若参数为非数值时，通过隐式转换不能转变为数值，则返回NaN，Math 的所有属性和方法都是静态的，调用时无需new
Math方法：
Math.max(参数) // 选出参数中最大的数
Math.min(参数) // 选出参数中最小的数
Math.floor(参数) // 向下取整数
Math.ceil(参数) // 向上取整数
Math.round(参数) // 对参数进行四舍五入，有一个特殊的地方参数为.5整时，参数向着大的值的方向进行四舍五入，Math.round(-1.50)//-1 而不是-2，Math.round(-1.51)//-2
Math.PI // 圆周率
Math.abs(参数) // 参数绝对值
Math.sign(参数) // 函数返回一个数字的符号, 会对传入的参数进行隐式转换，指示数字是正数，负数还是零，返回值为-1，-0，0，1，NaN
Math.random() // 得到一个大于等于0，小于1之间的随机数
关于获取两个指定数值之间的随机数：
①得到一个两数之间的随机数:>=min && <max
function getRandomArbitrary(min, max) {
return Math.random() * (max - min) + min;
}
②得到一个两数之间的随机整数: >=min(向上取整数) ,<max
function getRandomInt(min, max) {
min = Math.ceil(min);
max = Math.floor(max);
return Math.floor(Math.random() * (max - min)) + min;
//不含最大值，含最小值
}
③得到一个两数之间的随机整数，包括两个数在内，可以用于制作随机点名效果
function getRandomIntInclusive(min, max) {
min = Math.ceil(min);
max = Math.floor(max);
return Math.floor(Math.random() * (max - min + 1)) + min; //含最大值，含最小值
}
代码实践-随机生成一个1-10之间的整数，让用户输入一个数字：
1若数字小于随机数，则弹出输入框’猜小了’；
2若数字大于随机数，则弹出输入框’猜大了’；
3若数字等于随机数，则弹框’恭喜您，猜对了’
4不限制猜测次数
function getRandomIntInclusive(min, max) {
min = Math.ceil(min);
max = Math.floor(max);
return Math.floor(Math.random() * (max - min + 1)) + min;
}
var random_num = getRandomIntInclusive(1, 10)
var num = prompt('请猜测一个1-10之间的随机整数')
while (true) {
if (num > random_num) {
num = prompt('猜大了')
} else if (num < random_num) {
num = prompt('猜小了')
} else {
alert('恭喜您，猜对了')
break;//终止循环
}
}
随机生成一个1-50之间的整数，让用户输入一个数字：
1若数字小于随机数，则弹出输入框’猜小了’；
2若数字大于随机数，则弹出输入框’猜大了’；
3若数字等于随机数，则弹框’恭喜您，猜对了’
4只能猜测10次
function getRandomIntInclusive(min, max) {
min = Math.ceil(min);
max = Math.floor(max);
return Math.floor(Math.random() * (max - min + 1)) + min; //含最大值，含最小值
}
var random_num = getRandomIntInclusive(1, 50)
var action_time = 0
var num = prompt('请猜测一个1-50之间的随机整数')
while (true) {
if (num > random_num) {
action_time++
if (action_time == 10) {
num = alert('猜大了,机会用尽')
break;
} else {
num = prompt('猜大了')
}
} else if (num < random_num) {
action_time++
if (action_time == 10) {
num = alert('猜小了,机会用尽')
break;
} else {
num = prompt('猜小了')
}
} else {
alert('恭喜您，猜对了')
break;
}
}
二、JS中的内置对象Date:
创建一个新Date对象的唯一方法是通过new 操作符：
let now = new Date();
只能将 Date 作为构造函数调用，才能实例化（instantiate） Date 对象：若将它作为常规函数调用（即不加 new 操作符），则将会返回一个字符串，而非 Date 对象。另外，不像其他的 JavaScript 对象类型，Date 对象没有字面量语法（literal syntax）。
Date.prototype 方法:
1
Date.prototype.getFullYear()
根据本地时间返回指定日期对象的年份（四位数年份时返回四位数字）。
2
Date.prototype.getMonth()
根据本地时间返回指定日期对象的月份（0-11），返回的月份小一个月，记得+1
3
Date.prototype.getDate()
根据本地时间返回指定日期对象的月份中的第几天（1-31）。
4
Date.prototype.getHours()
根据本地时间返回指定日期对象的小时（0-23）。
5
Date.prototype.getMinutes()
根据本地时间返回指定日期对象的分钟（0-59）
6
Date.prototype.getSeconds()
根据本地时间返回指定日期对象的秒数（0-59）
7
Date.prototype.getMilliseconds()
根据本地时间返回指定日期对象的毫秒（0-999）。
8
Date.prototype.getDay()
根据本地时间返回指定日期对象的星期中的第几天（0-6）。可以通过数组[‘星期日’,‘星期一’,‘星期二’,‘星期三’,‘星期四’,‘星期五’,‘星期六’]，实现将0-6转为为中文星期几的功能。
9
Date.prototype.getTime()
返回从1970-1-1 00:00:00 UTC（协调世界时）到该日期经过的毫秒数，对于1970-1-1 00:00:00 UTC之前的时间返回负值。
10
Date.prototype.getTimezoneOffset()
返回协调世界时（UTC）相对于当前时区的时间差值，单位为分钟。
代码实践：
1、日期格式化，需要手动进行设置，主要通过字符串相连的方式实现
示例：实现2019-8-8 8:8:8格式的日期
var date = new Date();
let year = date.getFullYear()
let month = date.getMonth() +1
let day = date.getDate()
let hour = date.getHours()
let minute = date.getMinutes()
let second = date.getSeconds()
console.log('现在的时间是：' + year + '-' + month + '-' + day + ' ' +hour + ':' + minute + ':' + second)
```
==>现在的时间是：2019-10-12 10:16:23
//封装一个函数返回当前的时分秒
```javascript
function getTime (){
var time = new Date()
var h = time.getHours()
h = h < 10 ? '0' + h : h //若为个位数前面自动补充0
var m = time.getMinutes()
m = m < 10 ? '0' + m : m //若为个位数前面自动补充0
var s = time.getSeconds()
s = s < 10 ? '0' + s : s//若为个位数前面自动补充0
return h + ':' + m + ':' + s;
}
console.log(getTime())
2、返回从1970年1月1日0时0分0秒至当前时间经历的毫秒数的方法
①Date.now() //H5新增的，需考虑浏览器兼容性 通过增加如下代码使得其在不兼容的浏览器中也可返回毫秒数
if (!Date.now) {
Date.now = function now() {
return new Date().getTime();
};
}
②+new Date() // 均返回毫秒数 最常用且最简单的用法
③var time = new Date()
time.getTime() // 均返回毫秒数
④var time = new Date()
time.valueOf()
3、封装一个函数制作倒计时效果
function countDownTime(time){
var nowTime = +new Date()
var inputeTime = +new Date(time)
var times = (inputeTime - nowTime) / 1000
var d = parseInt(times / 60 / 60 / 24)
d = d<10? '0' + d : d; // 若d<10,则自动在前方补充一个0
var h = parseInt(times / 60 / 60 % 24)
h = h<10? '0' + h : h; // 若d<10,则自动在前方补充一个0
var m = parseInt(times / 60 % 60 )
m = m<10? '0' + m : m; // 若d<10,则自动在前方补充一个0
var s = parseInt(times % 60 )
s = s<10? '0' + s : s; // 若d<10,则自动在前方补充一个0
return d + '天' + h + '时' + m + '分' + s + '秒';
}
console.log(countDownTime('2019-10-12 21:08:08'))
三、JS中的内置对象Array:
数组对象是一个有序的数据（数据可以是 原始类型 或 对象类型）集合。相对于变量，数组可用于在一个变量中存储多个变量值。数组索引从0开始。
1、检测是否是一个数组
① Array.isArray(参数) // 用于确定传递的值是否是一个 Array（H5新增的方法，ie9以上版本支持）。如果对象是 Array，则为true; 否则为false。
②instanceof // 是一个运算符
var arr = [];
var obj = {};
arr instanceof Array // true
obj instanceof Array // false
2、数组对象的创建有两种方法：
①字面量方式:
var arr = [1,2,3]
②new Array() :
Var arr1 = new Array() // 创建一个空数组
Var arr1 = new Array(2) // 创建了一个数组长度为2的数组，里面有两个空的元素
Var arr1 = new Array(1,2) // 等价于[1,2]
3、遍历数组：
var fruits = ['apple', 'pear', 'purple', 'banana']
fruits.forEach(function (item, index, array) {
console.log(item, index);
});
// apple 0 pear 1 purple 2 banana 3
4、数组方法：
① 反转数组 Array.reverse()
let arr = [1,2,3]
arr.reverse() // [3,2,1]
②添加删除数组元素
添加元素：
Array.push(参数) 末尾添加一个或多个元素，修改原数组，返回新数组长度
Array.unshift(参数) 开头添加一个或多个元素，修改原数组，返回新数组长度
删除元素：
Array.pop(参数) 删除数组最后一个元素，修改原数组，返回被删除元素的值
Array.shift(参数) 删除数组的第一个元素，修改原数组，返回第一个元素的值
③对数组进行排序
Array.sort([compareFunction]) // 对数组元素进行排序，并返回数组
中括号表示可选参数，若不添加compareFunction，则该方法默认排序顺序是在将元素转换为字符串的各个字符的Unicode位点进行排序。若指明compareFunction，那么数组会按照调用该函数的返回值排序。即 a 和 b 是两个将要被比较的元素：
如果 compareFunction(a, b) 小于 0 ，那么 a 会被排列到 b 之前；
如果 compareFunction(a, b) 等于 0 ， a 和 b 的相对位置不变。备注： ECMAScript 标准并不保证这一行为，而且也不是所有浏览器都会遵守（例如 Mozilla 在 2003 年之前的版本）；
如果 compareFunction(a, b) 大于 0 ， b 会被排列到 a 之前。
对数字以升序的方式进行排序时：
function compareNumbers(a, b) {
return a - b;
}
对数字以降序的方式进行排序时：
function compareNumbers(a, b) {
return b - a;
}
④数组索引方法
Array.indexOf(searchElement [, fromIndex = 0]) // 返回第一个满足条件的元素的索引号，若不存在，返回-1；fromIndex为可选参数，若为负数，则表示从数组的倒数第几个元素开始向后查找
Array.lastIndexOf(searchElement [, fromIndex = 0]) 返回数组最后一个满足条件的元素索引号，若不存在，返回-1；romIndex为可选参数，若为负数，则表示从数组的倒数第几个元素开始从后向前查找
⑤将数组转化为字符串
Array.toString()
Array.join([separator]) // separator指定一个字符串来分隔数组的每个元素。如果需要，将分隔符转换为字符串。如果缺少该值，数组元素默认用逗号（,）分隔。如果separator是空字符串("")，则所有元素之间都没有任何字符。举例：Array.join(‘&’), Array.join(‘-’)
⑥连接数组
Array.concat(value1[, value2[, ...[, valueN]]]) //用于合并两个或多个数组和/或值。此方法不会更改现有数组，而是返回一个新数组。
⑦拷贝数组
Array.slice([begin[, end]]) // begin 提取起始处的索引（从 0 开始），从该索引开始提取原数组元素。
若begin省略，则默认从0开始；end提取终止处的索引（从 0 开始），在该索引处结束提取原数组元素。
slice 会提取原数组中索引从begin 到 end 的所有元素（包含 begin，但不包含 end）。如果 end 被省略
或者大于数组长度，则 slice 会一直提取到原数组末尾。举例Array.slice(1,4)，表示提取1，2，3索引处
的元素，并返回一个含有被提取元素的新数组。
⑧替换或删除数组元素
Array.splice(start[, deleteCount[, item1[, item2[, ...]]]])
通过删除或替换现有元素或者原地添加新的元素来修改数组,返回值为以数组形式表现的被修改的内容。此方法会改变原数组。
start 指定修改开始的位置，若超出数组的长度，则从数组末尾开始添加内容；如果是负值，则表示从数组末位的第n个元素开始；如果负数的绝对值大于数组的长度，则表示开始位置为第0位。
deleteCount 表示要移除的数组元素的个数，为0或负值则表示不进行移除
item1, item2, ... 要添加进数组的元素,从start 位置开始。如果不指定，则 splice() 将只删除数组元素。
举例：
let arr = ['c', 'a', 'b', 'x', 'a', 'n', 'c', 'c', 'b']
console.log(arr.splice(0,2,'kaishi','jieshu')) //["c", "a"]
console.log(arr)//["kaishi", "jieshu", "b", "x", "a", "n", "c", "c", "b"]
5、代码实践：
① 把数组[1500,1200,2000,2100,1800]中超过2000的删除，其余放入一个新数组中：
let arr = [1500,1200,2000,2100,1800]
let arr1 = []
// 使用forEach遍历数组元素 或使用for循环对数组进行遍历也可
arr.forEach(function(item,index,array){
if(item < 2000){
arr1.push(item)
}
})
console.log(arr1);//[1500, 1200, 1800]
或
for(let i = 0;i< arr.length;i++){
if(arr[i]<2000){
arr1.push(arr[i])
}
}
console.log(arr1);//[1500, 1200, 1800]
②数组去重：移除数组中重复的元素（在新数组中查询旧数组中的元素）
let arr = ['c', 'a', 'b', 'x', 'a', 'n', 'c', 'c', 'b']
let arr1 = []
for (let i = 0; i < arr.length; i++) {
let index = arr1.indexOf(arr[i])
if (index === -1) {
index = 1
arr1.push(arr[i])
}
}
console.log(arr1) //["c", "a", "b", "x", "n"]
四、JS中的内置对象String:
属性：
str.length // 返回字符串长度
方法：
1
str.charAt(index)
从一个字符串中返回指定的字符，若没有提供索引，charAt() 将使用0。
2
str.charCodeAt(index)
表示给定索引处（String中index索引处）字符的 UTF-16 代码单元值的数字；如果索引超
出范围，则返回 NaN。例如a对应的Unicode 值为97;
3
str.concat(string2, string3[, ..., stringN])
将一个或多个字符串与原字符串连接合并，形成一个新的字符串并返回。
concat方法并不影响原字符串。但由于性能的原因，强烈建议使用 赋值操作符（+, +=）代替 concat 方法
（来自mdn网站的建议）
4
str.includes(searchString[, position])
用于判断一个字符串是否包含在另一个字符串中，根据情况返回 true 或 false。searchString: 要在此字符串中搜索的
字符串;position: 可选。从当前字符串的哪个索引位置开始搜寻子字符串，默认值为0. includes() 方法是区分大小写的
举例：
var str = 'To be, or not to be, that is the question.'
console.log(str.includes('To be')); // true
5
str.indexOf(searchValue[, fromIndex])
返回第一次满足条件的指定值的索引，若没找到，返回-1；
//indexOf 方法区分大小写。 若忽略searchValue，则searchValue 会被强制设置为 “undefined”， 然后在当前字符串中
//查找这个值。
6
str.lastIndexOf(searchValue[, fromIndex])
返回指定值在调用该方法的字符串中最后出现的位置,其余同str.indexOf（）
7
str.repeat(count)
count为介于0（包含0）和无穷大之间的整数，返回值为包含指定字符串的指定数量副本的新字符串。
示例：
let arr = ‘abc’
Console.log(arr.repeat(3)) // ‘abcabcabc’
8
str.replace(substr,newSubstr)
substr:一个将被 newSubStr 替换的 字符串, 仅第一个匹配项会被替换; newSubstr:用于替换掉第一个参数在原字符串中的匹配部分的字符串。
举例：
let str = "John Smith";
let newstr = str.replace('J', "abc");
console.log(newstr);// abcohn Smith
9
str.valueOf()
返回String对象的原始值，该方法通常在 JavaScript 内部被调用，而不是在代码里显式调用
举例：x = new String(“Hello world”);
alert(x.valueOf()) // Displays “Hello world”
10
str.toLowerCase()
字符串值转为小写形式, toLowerCase 不会影响字符串本身的值。与之相反的是str.toUpperCase() // 字符串值转为大写形式；
11
str. toString()
方法返回指定对象的字符串形式。
示例：
var x = new String("Hello world");
alert(x.toString()) // 输出 "Hello world"。
12
str.slice(beginIndex[, endIndex])
提取某个字符串的一部分，并返回一个新的字符串，且不会改动原字符串。提取的新字符串包括beginIndex但不包括 endIndex。
13
str.substring(indexStart[, indexEnd])
返回值为包含给定字符串的指定部分的新字符串，关于参数：
如果 indexStart 等于 indexEnd，substring 返回一个空字符串。
如果省略 indexEnd，substring 提取字符一直到字符串末尾。
如果任一参数小于 0 或为 NaN，则被当作 0。
如果任一参数大于 stringName.length，则被当作 stringName.length。
如果 indexStart 大于 indexEnd，则 substring 的执行效果就像两个参数调换了一样。
代码实践：
① 查找字符串’abcoefoxyozzopp’中’o’所有出现的位置及次数
核心算法：先查找第一个o出现的位置，只要不是-1，则继续向下查找，同时记得index+1
let num = 0
let str = 'abcoefoxyozzopp'
let index = str.indexOf('o')
while (index !== -1) {
num++
console.log(index)
index = str.indexOf('o', index + 1)
}
console.log(‘o出现的次数是：’ + num)
扫一扫
495
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
