今天就是回顾了一下昨天的jSON,主要还是学习字符串
一、this对象
- this它是function数据类型提供的一个对象,这个对象指的是某个具体的对象
- this这个对象会随着函数调用的方式的不同,自身的指向也不同
- this和return还有arguments是一样的,你可以使用也可以不使用,只要有函数就有它们
函数调用方式:
- 函数名() —— 调用window
- 事件调用 —— 调用事件调用者
- 自调用 —— 调用window
- 对象名.函数名() —— 调用对象本身
例子:按钮背景切换
//html代码:
<ul>
<li class="bg">我的</li>
<li>娱乐</li>
<li>热门</li>
<li>购物</li>
<li>游戏</li>
</ul>
//css代码:
*{
margin: 0;
padding: 0;
}
ul{
width: 420px;
height: 30px;
background-color: yellow;
margin: 50px auto;
display: flex;
justify-content: space-between;
align-items: center;
}
ul li{
width: 20%;
list-style: none;
text-align: center;
line-height: 30px;
cursor: pointer;
}
/*交集选择器*/
ul li.bg{
background-color: greenyellow;
}
//js代码:
//获取元素
var aLi = document.getElementsByTagName('li');
//给所有的li标记绑定点击事件
for(var i=0; i<aLi.length; i++){
aLi[i].onclick = function(){
//className可以通过js形式直接把类名给标记设置
//console.log(this)
//需求:当点击那个按钮的时候,那个按钮有背景颜色,其他的按钮没有背景颜色的
//思路:排他思想,先干掉所有人,最后只留下自己
//注意点:在事件处理函数里面的循环结构,不会有问题,按着正常的执行顺序解析代码
for(var j=0; j<aLi.length; j++){
//一开始先把所有li的背景颜色清除掉
aLi[j].className = "";
//console.log(j)
}
this.className = 'bg';
}
}
二、字符串
概念:
- 只要是双引号或者单引号包裹起来的字符就是字符串类型
- 其实字符串既是基本数据类型,其实它也属于引用数据类型
- 字符串创建方式
1、使用字面量形式
2、使用构造函数形式
3、使用String关键字形式 - 字符串类型属不属于引用数据类型,在于是不是使用构造函数形式创建的
- 字面量形式的字符串也可以使用对象里面给咱们提供的一些属性和方法
包装类:
- String
- Number
- Boolean
- 包装类的作用,使用基本数据类型的属性和方法时,包装类会让基本数据类型先
转换成引用数据类型,当使用完毕后,又转换成了基本数据类型
方法:
length:获取字符串长度
toLowerCase():将字符串中的字母转成全小写
toUpperCase():将字符串中的字母转成全大写
//[]获取字符串里面的字符形式在低版本的IE浏览器下面有兼容问题不支持
//charAt()低版本的IE浏览器是支持的
charAt(index):返回指定下标位置的一个字符。如果没有找到,则返回空字符串; 参数是下标
//第一个参数为字符串,第二个参数为开始位置(可以不写)
//注意:如果不指定第二个参数,默认会从下标为0的位置上进行查找,如果指定了就按照指定的位置进行查找
indexOf():返回一个字符串在原始字符串中的索引值(查找顺序从左往右查找)。如果没有找到,则返回-1;
lastIndexOf():在原始字符串中,从右往左查找。如果没有找到,则返回-1;
substring():在原字符串,返回一个字符串;不取结束位置,不能给负值会转成0
split():将一个字符串切割成若干段,返回一个数组。也就是说将一个字符串转成数组;括号里面可以给空字符串, 会把字符串切割成几份
slice():提取字符串的片段,并在新的字符串中返回被提取的部分,不包括结束位置。给负值表示倒数第几个。
trim():移除字符串首尾空白;trimLeft() trimRight()
concat():连接两个或多个字符串,返回连接后的字符串
replace() 替换与正则表达式匹配的子串
substr() 从起始索引号提取字符串中指定数目的字符。参数1表示起始位置 、值2表示截取的项数
//slice 给负值会转成倒数,不包含结束位置
//substring 给负值会转成0,不包含结束位置
//substr 参数2表示的是项数