JS对象
js对象:
js有三种对象:
1.内置对象:Math,Array,String,Object,Date //注意Math对象是静态对象,里面属性和方法Math.xxx(num)调用
2.自定义对象:自定义构造函数创建的对象
3.浏览器对象:
a. 基本概念:
(1)对象是什么:是一块堆区创建的存储数据的空间,要使用它必须用一个变量指向它,否则无法找到这个数据
(2)什么是创建对象:在内存堆区中申请一块空间按类的数据结构存储一块数据,并将数据的地址赋值给栈区的变量。这样就可以通过变量名来使用这块数据
(3)什么是实例化类:就是创建类的对象,在内存堆区中申请一块空间按类的数据结构存储一块数据。
b. js中对象的使用:
(1)创建类:(自定义一个数据结构)
function Person (){...} //使用构造函数创建一个Person类型数据
(2)实例化类:(创建对象)
1. var obj = new 对象名(); //实例化指定名字的对象,对象名首字母大写
2. var obj = {}; //使用字面量方式,实例化系统对象Object
var obj = new Object; //与上面字面量方式等效
(3)给对象写入数据:
1. 在创建对象的类时就写入数据
function Person(){ //创建Person对象,里有2个属性 name 和 age this.name = "小花"; this.age = 23; }
2. 在创建对象时写入数据
var lisi = new Person("小红","22"); //前提条件,在创建对象时,设了相应形参。
function Person(name,age){
this.name = name;
this.age = age;
}
//实例化Object类,并写入数据
var liwu = {}
liwu.name = "liwu";
liwu.age = 22;
//或如下,2中写法等效
var liwu = {
name:"liwu",
age:21
}
(4)如何使用对象中的数据(先实例化再使用)
变量名.属性名 或 变量名[“属性名”]
function Person(){ this.name = "小花"; this.age = 23; } var lisw = new Person(); console.log(lisw.name); console.log(lisw["age"]);
console.log(lisw.haha);//输出undefined,给Person对象添加了haha属性,但未赋值
console.log(lisw["haha"]);//同上
(5)遍历对象
var obj = new Person(); //对象实例化后才可遍历
for(var key in obj ){ console.log(obj[key]); //输出变量一个属性的值 console.log(obj.key); //输出undefined,没有key属性 }
内置对象:
1. Array (数组)
(1)数组作用:存储一组有序的数据
(2)定义方式:代码中定义数组的语法
1. 使用构造函数定义
var arr = new Array(); //定义一个空数组
var arr = new Array(5); //定义一个长度为5的数组(只有5个元素的数组,每个元素值为undefined)
var arr = new Array(1,23,354,77); //定义一个有多个元素的数组
2. 使用字面量方式定义:
var arr = []; //定义一个空数组
var arr = [1,3,4,"aa"];
注意:在js中只有索引数组,没有关联数组
(3)常用方法:
2.arguments对象(伪数组)
当函数没有形参时,用来接收函数调用时传入的参数。
3.函数
函数是什么:一段封装的代码
定义方式:(函数名就是存储函数数据结构的空间的名字,就是一个变量名。使用时和普通变量有区别,函数名后要加括号)
1. function aa(){...} //表示变量aa存储的是一个函数,aa是函数名
2. var aa = function(){..} //表示变量aa存储的是一个函数,aa是函数名
2中定义方式的区别:
f1(); function f1(argument) { console.log(a); var a = 10; }
//输出undefined,说明函数在f1()前已定义。提前声明了函数
f1(); var f1 = function(argument) { console.log(a); var a = 10; }
//报错,说明f1()前函数未定义。提前声明了f1变量,但f1不是函数,不能被调用
调用方式:
1. aa(形参); //函数名加()调用。可多次调用
2.(function(){...})(形参); //自调用。函数一次性调用,可避免命名冲突
(2)数学对象
Math.abs(num); //取绝对值
Math.max(num); //
Math.min(num); //
Math.ceil(num); //向上取整
Math.floor(num); //向下取整
Math.round(num); //4舍5入
Math.random(); //产生0-1间的随机数。16位
Math.sqrt(num); //求num的平方根
Math.pow(num,n); //求num的n次幂
应用:
产生随机颜色:
function getColor(){ var str = "#"; var arr = ["0","1","2","3","4","5","6","7","8","9","a","b","c","d","e","f"]; for(var i=0; i<6; i++){ var num = parseInt(Math.random()*16); str += arr[num]; } return str; }
(3)日期对象
var dt = new Date(); //实例化时可以传入参数,"2019-11-29", "2019/11/28"
dt.getFullyear(); //年
dt.getMonth(); //获取月份(0-11)
dt.getDate(); //获取是该月几号
dt.getHours();
dt.getMinutes();
dt.getSeconds();
dt.getDay(); //获取星期几
dt.toTimeString(); //10:18:12 GMT+0800 (中国标准时间)
dt.toLocaleString(); //上午10:19:57
dt.getTime(); //获取当前时间戳
dt.getMilliseconds(); //获取当前时间后的毫秒数,如 245
应用:格式化日期
function dateFormat(dt){ var year = dt.getFullYear(); var month = dt.getMonth()+1; var date = dt.getDate(); var hour = dt.getHours(); var minute = dt.getMinutes(); var second = dt.getSeconds(); month= month<10?"0"+month:month; date = date<10?"0"+date:date; hour= hour<10?"0"+hour:hour; minute= minute<10?"0"+minute:minute; second= second<10?"0"+second:second; return year+"年"+month+"月"+date+"日"+"-"+hour+":"+minute+":"+second } var dt = new Date(); console.log(dateFormat(dt));
(4)字符串对象
特性:1. 可以看作是一个个字符组成的数组,能用for遍历
2. 只要定义了一个字符串对象,则里面存储的数据只能读不可写,即值不可更改
3. js中没有字符类型数据,一个字符也被当做一个字符串
使用字符串对象:
1. 实例化:
var str = new String("abc"); //使用字符串对象的构造函数创建实例。可以添加方法和属性。
var srt = "abc"; //使用字面量方式创建。只能使用string对象已有的方法和属性,不能添加方法和属性
2. 使用字符串对象的属性和方法