JS学习50-75

一、数组常用方法 （p50

1.push
后面追加一个元素

var arr = [1, 2, 3]
arr.push(4)
console.log(arr) 

2. pop
删除数组末尾的一个元素
（返回值为删除的元素

var arr = [1, 2, 3]
arr.pop()
console.log(arr) 

3. unshift和shift
unshift :在数组的最前面添加一个元素
shift 是删除数组最前面的一个元素
返回值：删除的这个元素

var arr = [1, 2, 3]
arr.unshift(4)
console.log(arr) // [4, 1, 2, 3]

4. splice
删除与增加
截取数组中的某些内容

var arr = [1, 2, 3]
arr.shift()
console.log(arr) 

5.reverse

倒序

var arr = [1, 2, 3]
arr.reverse()
console.log(arr) // [3, 2, 1]

6. sort

排序

var arr = [2, 3, 1]
arr.sort()
console.log(arr) 

**7.concat **
把多个数组进行拼接，有顺序要求

ps：不会改变原始数组，而是返回一个新的数组

var arr1 = [1, 2, 3]
var arr2 = [4, 5, 6]
var arr3 = arr2.concat(arr1)
console.log(arr1,arr2,arr3)

8.join
数组=》字符串
(不会改变原始数组，而是把链接好的字符串返回

var arr = [1, 2, 3]
var str = arr.join
console.log(arr) 
console.log(str) 

二、字符串

两种创建方法：字面量和构造函数

字符串的常用方法之索引：

substr：开始索引，长度
substring开始索引，结束索引
slice开始索引，结束索引

charAt：
索引，返回索引对应的字符

var str = 'chris'
var index = str.charAt(2)
console.log(index) 

charCodeAt：
索引，返回索引对应的字符
返回对应索引位置的 unicode 编码

var str = 'chris'
var index = str.charCodeAt(0)
console.log(index) 

indexOf：

indexOf ：按照字符找到对应的索引

var str = 'chris'
var index = str.indexOf('c')
console.log(index) 

返回值为 0

substr与substring：
substr（开始索引）substring（开始索引，结束索引）
可以截取字符串

var str = 'hello'
var newStr = str.substring(1, 3)
console.log(newStr) 

所以返回的是 el

substr：
区别：substr参数是截取多少个

从索引 1 开始，截取 3 个，所以得到的是 ell

toLowerCase 和 toUpperCase：

这两个方法分别使用用来给字符串转成小写字母和大写字母的
三、数字常用方法
Math
Math ：js 的内置对象

//random0-1-随机整数
console.log(Math.random())
小于多少就乘以多少
//round四舍五入取整
console.log(Math.round(4.46))
// ceil向上取整 floor向下取整
console.log(Math.floor(4.96))
//abs绝对值
console.log(Math.abs(-10.2))
//sqrt平方根9
console.log(Math.sqrt(8))
//pow(底数，指数）
console.log(Math.pow(3,3))
//max（多个参数）
console.log(Math.max(10,50,20,34))
//min（多个参数）
console.log(Math.min(10,50,20,34))
//PI
console.log(Math.PI)

对应结果

max：

Math.max() 得到的是你传入的几个数字之中 最大 的那个数字

1
min：

Math.min() 得到的是你传入的几个数字之中 最小 的那个数字

PI：
小数点后 15 位
不需要加 () 的

四、事件对象

Date
内置构造函数，
用来获取时间

将日期字符串格式化成指定内容

getFullYear：

getFullYear() 方式是得到指定字符串中的哪一年

var time = new Date(2019, 03, 03, 08, 00, 22)
console.log(time.getFullYear()) // 2019
1
2
getMonth：

getMonth() 方法是得到指定字符串中的哪一个月份

月份是从 0 开始数的

0 表示 1月，1 表示 2月，依此类推

getDate：得到指定字符串中的哪一天

var time = new Date(2019, 03, 03, 08, 00, 22)
console.log(time.getDate()) // 3

getHours：得到指定字符串中的哪小时

getMinutes：、、分钟

getSeconds：、、秒

getDay：、、天（周日是 0，周六是 6）

五、定时器

倒计时定时器&间隔定时器

倒计时定时器：
倒计时多少时间以后执行函数

语法： setTimeout（要执行的函数，多长时间以后执行

var timerId = setTimeout(function () {
  console.log('我执行了')
}, 1000)
console.log(timerId) /

PS：会在页面打开 1 秒钟以后执行函数，只执行一次
返回值：当前这个定时器是页面中的第几个定时器

间隔定时器：
每间隔多少时间就执行一次函数

语法： setInterval(要执行的函数，间隔多少时间

var timerId = setInterval(function () {
  console.log
}, 1000)

与一不同：只要不关闭，会一直执行
返回值是，当前这个定时器是页面中的第几个定时器

定时器的返回值：

设置定时器的时候，他的返回值是部分 setTimeout 和 setInterval 的
如果将其定义返回值会是其的顺序（第n个定时器则返回n）
关闭定时器：

关闭以后，定时器就不会在执行了

<button>id="btn1">清除定时器-延时</button>
<button>id="btn2">清除定时器-间隔</button>
console.log(btn1,btn2)
btn1.onclick = function(){
console.log("btn1 click")
clearTimeout(time1)
}

七、BOM

BOM（Browser Object Model）： 浏览器对象模型
可操作浏览器进行页面跳转等等

BOM 的核心就是 window 对象
window 是浏览器内置的一个对象，里面包含着操作浏览器的方法

获取浏览器窗口的尺寸

浏览器的弹出层：

1.alert 是在浏览器弹出一个提示框

2.confirm 是在浏览器弹出一个询问框
ps：这个弹出层有一个询问信息和两个按钮，当你点击确定的时候，就会得到 true，当你点击取消的时候，就会得到 false prompt 是在浏览器弹出一个输入框

btn.onclick=function(){
var res=confirm("你确定删除吗？")
console.log(res)

浏览器的地址信息：
（用来存储浏览器的地址栏内的信息

location.href：

location.href 这个属性存储的是浏览器地址栏内 url 地址的信息

ps：不要写在全局，不然浏览器就会一直处在刷新状态

浏览器的历史记录：

window 中有一个对象叫做 history是专门用来存储历史记录信息

history.back：回到前一个页面
history.forword：去到下一个历史记录里面

浏览器的 onload 事件：

ps：前提是页面的高度要超过浏览器的可是窗口才可以

浏览器滚动的距离：

scrollTop：

获取的是页面向上滚动的距离

两个都是获取页面向上滚动的距离

二者区别：

IE 浏览器：
有 DOCTYPE 声明的时候，只能用document.documentElement.scrollTop

Chrome 和 FireFox：
没有 DOCTYPE 声明的时候，用 document.body.scrollTop
有 DOCTYPE声明的时候，用document.documentElement.scrollTop

Safari：
两个都不用，使用一个单独的方法 window.pageYOffset

scrollLeft：
获取页面向左滚动的距离