前端学习---JS高级教程

JS对象

JS中所有事物都是对象。字符串、数值、数组、函数、布尔型、数字型、日期、数学和正则表达式都是对象，也可以自定义对象。
对象;是一种特殊的数据,拥有属性和方法.
属性：事物的特征
方法：事物的行为

创建对象的三种方式

利用字面量创建对象：

var obj={}; //创建了一个空对象
var obj={
uname:'张三',
age:18,
sex:'男',
sayHi:function(){
alert('hi');
	}
} //创建了非空对象
console.log(obj.uname);//调用属性
console.log(obj['age']);
obj.sayHi();//调用方法
for(var k in obj){
console.log(k);//k为变量 输出为属性名
console.log(obj[k]);
}

利用new Object创建对象

var obj=new Object();//创建了一个空的对象
obj.uname='张三'';
obj.age=18;
obj.sayHi=function(){
console.log('hi');
}

利用构造函数创建对象

function Fun(uname,age,sex){
this.name=unme;
this.age=age;
 this.sex=sex;
 }
 var wcn=new Fun("张三",18,女);//调用函数返回的是一个对象
 console.log(wcn.name);
 var zwq=new Fun("李四",18,女);

通过new关键字创建对象的过程我们也称为对像实例化.
构造函数:就是把对象里面一些相同的属性和方法抽象出来封装到函数里面(构造函数名首字母大写,不需要return返回结果).

内置对象

常见的内置对象:Math、Date、Array、String。

Math对象

Math数学对象不是一个构造函数,所以不需要new来调用,而是直接使用里面的属性和方法即可.
利用对象封装自己的数学对象

var =nyMath={
PI:3.141592653;
max:function(){
var max=arguments[0];
for{var i=1;i<argument.length;i++){
if(arguments[i]>max){
max=arguments[i];
		}
	}
	return max;
}
}
console.log(nyMath.PI);

方法:

Math.abs(-1);//1 绝对值
Math.floor(1.9);//1 向下取整
Math.ceil(1.1);//2 向上取整
Math.round(1.1);//1 四舍五入
Math.round(-1.5)//1 .5特殊,它忘较大值取
Math.random();//返回一个随机的小数,且该小数大于等于0,小于1
function getRandom(min,max){//得到两个数之间的随机整数,并且包含这两个整数
Math.floor(Math.floor(Math.random*()max-min+1))+min;
}

Date对象

Date()日期对象,是一个构造函数,必须使用new来调用创建日期对象.

var date=new Date();//没有参数,返回当前系统的当前对象
var date1=new Date(2019,10,1);
console.log(date1);//返回的是11月,不是10月
var date2=new Date('2019-10-1 8:8:8');
console.log(date2);//更常用

日期格式化:

obj.getFullYear();//获取当年
obj.getMonth();//获取当月(0-11)
obj.getDate();//获取当天日期
obj.getDay();//获取星期几(周日0到周六6)
obj.getHours();//获取当前小时
obj.getMinutes();//获取当前分钟
obj.getSeconds();//获取当前秒钟

数组对象

创建数组

var arr=[1,2,3];//利用数组字面量
var arr1=new Array(2);表示创建了一个长度为2的数组
var arr2=new Array(2,3);表示创建了一个元素为2,3的数组 
var obj={};
console.log(arr instanceof Array);//检测是否为数组,返回true
console.log(obj instanceof Array);//返回false
console.log(Array.isArray(arr));//检测是否为数组,返回true

添加删除数组元素

var arr=[1,2,3];
arr.push(4,'pink');//在数组末尾添加一个或多个数组元素,返回数组长度
arr.unshift('red','purple');//在数组前面追加新元素
arr.pop();//删除数组最后一个元素,返回删除元素的值
arr.shift();//删除数组第一个元素

翻转数组

var arr=[1,2,3];
arr.reverse();

数组排序

var arr=[4,3,7,99,13];
arr.sort(function(a,b){
//returna-b;升序的顺序排列
return b-a;//降序的顺序排列
})

返回数组元素引导方法

var arr=['red','green','yellow','blue'];
console.log(arr.indexOf('blue'));//只返回第一个满足条件的索引号,在数组中找不到元素则返回-1

数组去重
原理:遍历旧数组,查询新数组

function unique(arr){
var newArr=[];
for(var i=0;i<arr.length;i++}{
if(newArr.indexOf(arr[i])===-1){
newArr.push(arr[i]);
		}
	}
	return newArr;
}
var demo=unique(['a','b','d','a','b','a','t','y']);

数组转化为字符串

var arr=[1,2,3];
console.log(arr.toString());
console.log(arr.join());//默认用逗号分割

字符串对象

基本包装类型就是把简单数据类型包装成复杂数据类型,而对象(为复杂数据类型)才有属性和方法.

字符串的不可变:指的是里面的值不可变,虽然看上去可以改变内容,但实际上地址变了,即内存中开辟了一个内存空间(不断开辟新空间会导致电脑卡顿).

根据字符返回位置

var str='爱上对方过后就哭了';
console.log(str.indexOf('对'),2);从索引号是2的位置开始查找,返回的的"对"的索引号

根据位置返回字符

var str='爱上对方过后就哭了';
console.log(str.charAt(3));返回索引号为3的字符
console.log(str.charCodeAt(0));返回相应索引号的字符的ASCII值(多用于判断用户按下了哪个键)
console.log(str[0];//和charAt()等效

拼接和截取字符串

替换字符串:str.replace(‘被替换的字符’,‘替换为的字符’); 只会替换第一个字符.
字符转为数组:str.split(’,’); 分隔符是什么取决于字符串由什么分割