对象是由属性和方法组成的,使用点语法访问
属性 : length 表示数组长度,可读可写
方法 :
1.push(data)
在数组的末尾添加一个或多个元素,多个元素之间使用逗号隔开
返回添加之后的数组长度
2.pop()
移除末尾元素
返回被移除的元素
3 . unshift(data)
在数组的头部添加一个或多个元素
返回添加之后的数组长度
4 . shift()
移除数组的第一个元素
返回被移除的元素
5 . splice(index,num)
从数组中添加/删除项目
返回被删除的项目
6 . toString()
将数组转换成字符串类型
返回字符串结果
7 . join(param)
将数组转换成字符串,可以指定元素之间的连接符,如果参数省略,默认按照逗号连接
返回字符串
8 . reverse()
反转数组,倒序重排
返回重排的数组,注意该方法直接修改原数组的结构
9 . sort()
对数组中元素排序,默认按照Unicode编码升序排列
返回重排后的数组,直接修改原有数组
参数 : 可选,自定义排序算法
例:
```javascript
//自定义升序
function sortASC(a,b){
return a-b;
}
```
作用:作为参数传递到sort()中,会自动传入两个元素进行比较,如果a-b>0,交换元素的值,自定义升序排列
```javascript
//自定义降序
function sortDESC(a,b){
return b-a;
}
//如果返回值>0,交换元素的值,b-a表示降序排列
```
<script>
console.log('Array 对象');
// 在数组的末尾添加一个或多个元素,多个元素之间使用逗号隔开
console.log('Array ----- push(data)');
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.push("Kiwi");
console.log(fruits);
// 在数组的末尾添加一个或多个元素,多个元素之间使用逗号隔开
console.log('Array ----- pop(data)');
fruits.pop();
console.log(fruits);
// 在数组的头部添加一个或多个元素
console.log('Array ----- unshift(data)');
fruits.unshift("Lemon","Pineapple");
console.log(fruits);
// 移除数组的第一个元素
console.log('Array ----- shift(data)');
fruits.shift();
console.log(fruits);
// 从数组中添加/删除项目
console.log('Array ----- splice(index,num)');
var citrus = fruits.slice(1,3);
console.log(citrus);
//将数组转换成字符串类型
console.log('Array ----- toString() ');
var stringfruits = fruits.toString();
console.log(stringfruits);
//将数组转换成字符串,可以指定元素之间的连接符,如果参数省略,默认按照逗号连接
console.log('Array ----- join(param) ');
var energy = fruits.join();
console.log(energy);
// 反转数组,倒序重排
console.log('Array ----- reverse()');
var res = fruits.reverse();
console.log(res);
// 对数组中元素排序,默认按照Unicode编码升序排列返回重排后的数组,直接修改原有数组
console.log('Array ----- sort()');
var ort = fruits.sort();
console.log(ort);
script>
数组中的每个元素又是数组
var arr1 = [1,2,3];
var arr2 = [[1,2],[3,4],[5,6,7]];
//操作数组元素
var r1 = arr2[0] //内层数组
var num = r1[0]; //值 1
//简写
var num2 = arr2[1][0];
var str = "100";
var str2 = new String("hello");
// new string的效率会差些
字符串采用数组结构存储每位字符,自动为字符分配下标,从0开始
length :获取字符串长度
转换字母大小写
toUpperCase() 转大写字母
toLowerCase() 转小写字母
返回转换后的字符串,不影响原始字符串
获取字符或字符编码
charAt(index) 获取指定下标的字符
charCodeAt(index) 获取指定下标的字符编码
参数为指定的下标,可以省略,默认为0
获取指定字符的下标
截取字符串
substring(startIndex,endIndex)
作用 : 根据指定的下标范围截取字符串,startIndex ~ endIndex-1
参数 :
startIndex 表示起始下标
endIndex 表示结束下标,可以省略,省略表示截止末尾
substr(startIndex,len)
作用:根据下标截取指定的字符串
分割字符串
split(param)
作用 : 将字符串按照指定的字符进行分割,以数组形式返回分割结果
参数 : 指定分隔符,必须是字符串中存在的字符,如果字符串中不存在,分割失败,仍然返回数组
模式匹配
正则表达式对象 RegExp
RegExp : Regualr Expression
语法 :
var reg1 = /微软/ig;
var reg2 = new RegExp(‘匹配模式’,‘修饰符’);
正则表达式对象可以接收一个变量。
属性 :
lastIndex : 可读可写,表示下一次匹配的起始索引
注意 :
① 默认情况下,正则表达式对象不能重复调用方法,
如果重复调用,结果会出错:
由于 lastIndex 保存再一次匹配的起始下标,
重复调用时,不能保证每次都从下标0开始
验证,可以手动调整 lastIndex 为 0。
②只有正则对象设置全局匹配 g ,该属性才起作用。
方法 :
test(str) :验证字符串中是否存在满足正则匹配模式的内容,存在则返回true,
不存在返回false参数为要验证的字符串。
作用 : 借助正则表达式实现字符串中固定格式内容的查找和替换
正则表达式 :
var reg1 = /字符模式/修饰符;
修饰符 :
i : ignorecase 忽略大小写
g : global 全局范围
字符串方法 :
<script>
//转大写字母
console.log(str.toUpperCase());
//转小写字母
console.log(str.toLowerCase());
// 获取指定下标的字符
var str1 = "HELLO WORLD";
console.log(str1.charAt(2));
// 获取指定下标的字符编码
var str2 = "HELLO WORLD";
console.log(str2.charCodeAt(0));
//从索引值为5的地方开始 获取2个
console.log(str.substr(5,2));
// 获取索引值为2~(5-1)的内容
console.log(str.substring(2,5));
// 获取从索引值5一直到最后的内容
console.log(str.substring(5));
// 获取从开始一直到最后的内容
console.log(str.substring());
// 从头开始 查找''is"的索引值
console.log(str.indexOf('is'));//2
// 从索引值10的位置开始 查找''is"的索引值
console.log(str.indexOf('is',10));//-1
script>
<div>
邮箱: <input type="text" id="email">
<button id="btn">获取信息button>
div>
<div id="show">
div>
<script>
var email = document.getElementById('email');
var btn = document.getElementById('btn');
var show = document.getElementById('show');
btn.onclick = function(){
// emial 是页面中的文本框
var arr = email.value.split('@');
var html = '';
// '用户名%s
' % arr[0]
html += '用户名:'
+arr[0]+'';
html += '运营商:'
+arr[1]+'';
show.innerHTML = html;
}
//当按钮(id=btn)被点击时
// 接收用户输入的邮箱(id=emial的值)
// 根据邮箱解析出用户名 运营商
// 将结果放到页面中显示(id=show)
script>
<p>
手机: <input type="text" id="phoneNum">
<span id="show">span>
p>
<p>
<button id="btn">验证手机号button>
p>
<script>
var btn = document.getElementById('btn');
var input = document.getElementById('phoneNum');
var span = document.getElementById('show');
btn.onclick = function(){
var str = input.value;//获取用户输入的手机号
var pattern = /1[356789]\d{9}/;//正则表达式对象
if(pattern.test(str)){
span.innerHTML = 'OK';
span.style = "color:green;font-size:12px;";
}else{
span.innerHTML = '请输入正确的手机号';
span.style = "color:red;font-size:12px;";
}
}
// 当按钮被点击时
// 获取用户输入的手机号(phoneNum的值)
// 定义正则表达式检测字符串
// 将结果显示到页面(show)
script>
<script>
// var reg = /is/;
// var reg2 = new RegExp('is');//正则表达式对象
// console.log(reg,reg2);
// console.log(reg.lastIndex);
var reg = /is/ig;
var str = 'this Is a test string';
var res1 = str.match(reg);
var res2 = str.match('is');
// console.log(res1,res2);
var str1 = str.replace(/this/,'that');
console.log(str1);//替换好的新字符串
console.log(str);
<script>
// 空对象
// var obj = {};
// console.log(typeof obj);
// obj.value = 10;
// console.log(obj);
// 带有数据的对象
// var Tom = {name:'Tom',age:18};
// console.log(Tom);
// console.log('姓名',Tom['name']);
// // console.log('姓名',Tom.name);
// console.log('年龄',Tom['age']);
// console.log('年龄',Tom.age);
// 循环遍历
// for(var key in Tom){
// console.log(key);//保存对象的属性名
// // console.log(Tom.key);//undefined
// console.log(Tom[key]);//通过属性名索引
// }
var qtx = {name:'Tom',age:18};
//json 用文本的方式表示js对象
// 用于前后端数据传输 (在前端和js对象操作一致)
//var json_obj = {'name':'Tom','age':18};
console.log(qtx);
// console.log(json_obj);
//字符串格式的JSON数据(发送数据给服务器)
var json_str = JSON.stringify(Timi);
console.log(json_str);
console.log('')
// 解析字符串格式的JSON数据
// 获取对应的JSON对象(接收服务器数据)
var json_obj = JSON.parse(json_str);
console.log(json_obj);
script>
Math对象主要提供一些列数学运算的方法
<script>
// 0~N之间的随机数
// Math.floor(Math.random()*(N+1))
console.log(Math.floor(Math.random()*2))
// 生成1~10之间的随机数
console.log(parseInt(Math.random()*10)+1)
script>
1. var date2 = new Date("2011/11/11");
2. var date3 = new Date("2011/11/11 11:11:11");
<script>
var now = new Date();
console.log(now);
//get 获取
now.getFullYear();//获取年
now.getMonth();//获取月(0~11)
now.getDate();//获取日期
now.getDay();//获取星期
now.getHours();//时
now.getMinutes();//分
now.getSeconds();//秒
//set 设置
var festival= new Date('2020/6/25');
console.log(festival);
now.getTime();//获取当前的时间戳(毫秒数)
// 1000毫秒 = 1秒
// 国庆节时间对象 - 当前的时间对象 = 时间差
console.log(festival-now);
// 在页面中显示端午节到现在的时间差
// 距离国庆节还剩 xx天xx时xx分xx秒
script>