# javaScript初学基础2

70 阅读6分钟

声明提前

在javaScript中创建的所有变量以及函数都会被提升到顶部,但是他们的值会留在原地,变量的提前会在函数上面。

作用域

javaScript中分为全局变量和局部变量。 全局变量:可以被全局中的所有函数使用,如何定义:直接在js中创建的变量就全局变量。 局部变量:只能被当前局部内部所使用,如何定义:在函数内部定义的变量就是局部变量。 通常局部没有的变量会在上一级去找一直找到全局,如果全局都没有就会报错。

重载

重载就是可以根据不同的参数执行不同的操作。 在js中可以使用argument来实现重载:arguments是函数中默认接住所有实参的一个类数组,即使我们不设置形参,传过来的实参也可以在arguments中获取如:arguments[0]就是获取了传过来的第一个实参。

遍历数组基础方法

var arr=[12,24,24,4,1]
for(var i=0;i<arr.length;i++){
    操作
}

DOM(document object model 文档对象模型)

在我们的页面上html并不是根,其实在这之上还有一个叫做document的树根,通过document树根才会衍生出html以及其他的标签等等;而我可以通过document树根来找到页面上的所有元素。

通过id查找元素

document.getElementById("元素id")--找到的是一个具体的元素 没啥用的方法因为我写了id其实就可以直接使用id就可以对元素进行操作了

通过标签查找元素

document.getElementsByTagName("元素标签名")--找到的是页面上所有的这个元素所组成的一个类数组想要具体得到最好遍历,如果元素较少可以直接写下标 这个方法比较实用,注意使用时得到的并不是一个单纯的元素

通过class名查找元素

document.getElementsByClassName("元素的class名")--同标签查找法得到的也是包含所有有查找的这个class名的一个类数组

通过关系查找元素(前提是先得到一个已经找到的元素)

找到xx元素的父元素

xx.parentNode--得到的是一个元素

找到xx元素的所有子元素

xx.children--得到的是一个类数组(要通过遍历或下标才能得到所有的子元素)

找到xx元素的第一个子元素

xx.firstElementChild--得到的是一个元素

找到xx元素的最后一个子元素

xx.lastElementChild--得到的是一个元素

找到xx元素的前一个兄弟元素

xx.previousElementSibling--得到的是一个元素

找到xx元素的后一个兄弟元素

xx.nextElementSibling--得到的是一个元素

通过js操作元素

操作元素的内容

xx.innerHTML=""--将元素中的内容修改为"",支持写入标签吗,可以识别

xx.innerText=""--将元素中的内容修改为"",但是不支持标签的识别

操作元素的属性

xx.getAttribute("属性")--得到元素该属性的属性值,支持自定义属性

xx.getAttribute("属性","新值")--修改元素的值为新值

简化写法:xx.属性名=""--不支持自定义属性

操作元素的样式

xx.style.css属性名="css属性值"

数组Array

创建数组方式:2种 直接量:var arr = [数据1,数据2...];

构造函数:var arr=new Array(数据1,数据2...)--此方法有一个坑,当我们的数据只是一位数字时,此方法会不会创建一个长度为一的数组,而是会创建一个长度为这个数字的一个空数组,中间全是undefined

查找数组中某个元素:arr[元素的下标];

数组中最后一位的下标:arr[arr.length-1];

遍历数组: for(var i=0;i<length;i++){ }

数组的API

不修改原数组的api

1.arr.join("自定义的连接符")--将数组转为字符串每个数组中的元素用自定义的连接符拼接

2.arr.concat("各种类型数据或数组 ")--添加元素到数组末尾,如果添加的是一个数组,会打散在添加到数组

3.arr.slice("start,end+1")--截取数组从start下标开始到end结束(因为含头不含尾所以需要加1)

遍历数组因为不修改原数组所以需要一个新数组接住

arr.map(function(v,i,arr){
    return 操作
})

判断数组中每个元素是否都满足,返回的是一个bool

arr.every(function(){
    return 判断的条件
})

判断数组中的元素是否满足,返回的是一个bool

arr.some(function(){
    return 判断的条件
})

对数组中的元素进行统一操作(汇总),返回的是操作完后的值

arr.reduce(function(prev,v,i,arr){
(prev指当前汇总的前一个值)
    return 需要进行的操作
})

过滤出数组中需要的元素--返回一个过滤完成后的过滤出来的元素组成的数组

arr.fliter(function(v,i,arr){
    return 过滤条件
})

修改原数组的api

从start删除n位

arr.splic(start,n)

在start前面插入元素

arr.splic(start,0,"元素(不会打散数组尽量不插入数组)")

将从start开始的后位替换为插入的元素

arr.splic(start,n,"元素")

翻转数组

arr.reverse()

对数组排序

arr.sort()--根据ascii码进行排序
//升序
arr.sort(function(a,b){-a代表后一个数-b代表前一个数
    retrun a-b
})
//降序
arr.sort(function(a,b){-a代表后一个数-b代表前一个数
    retrun b-a
})

在数组前面添加元素

arr.unshift("元素")

删除数组的第一个的元素

arr.shift()

在数组后面添加元素

arr.push("元素")

删除数组的最后一个的元素

arr.pop()

遍历数组

arr.forEach(function(v,i,arr){
    操作
})

11个引用类型

String ,Number,Boolean(既是原始类型又是引用类型)--因为javaScript底层有一个包装类型当我们使用这3个原始类型进行操作时,会自动被包装成引用类型

Array(数组),Function(函数),Object(对象),Date(日期),Math(数学),Error(错误),GloBal(全局)--在js中被window代替,RegExp(正则)

字符串String

转义字符:\n(换行),\t(制表符通键盘上的Tab),\u(可以识别十六进制Unicode号)

字符串的API

获取某个字符串中的某个位置的字符

str.charAt(i)

将字符串中的英文转为大写

var upstr= str.toUpperCase()

将字符串中的英文转为小写

var strlow = str.toLowerCase()

检索字符串中的关键字-从start位置开始返回找到的第一个关键字的下标,没找到返回-1

str.indexOf("关键字",start)

截取字符串

str.slice(start,end+1)--同数组的slice
str.substring(start,end+1)--同slice但是不支持负数
str.substr(start,n)--从start开始截取n位

拼接字符串

str.concat(" ")-不如使用+" "

字符串的替换

str.replace("替换的字符串""被替换的字符串")--支持正则

切割字符串--返回一个切割完毕后每个单独字符串组成的一个数组

str.split("想要切割的符号")

去掉开头结尾的空白字符

str.trim()

将字符串中的某个位置的字符转为ascii码

str.charCodeAt(i)

将ascii码解码为原文

var newstr= String.fromCharCodeAt(ascii)