面向对象
1 什么是对象
js对象有狭义,广义对象之分
1.1 狭义对象 指的是用{}定义的对象,它是一组无序的属性集合
//描述小明 用{} 形式包裹
var p1 = {
name:"xiaoming",
age:24,
hobby:["打豆豆","睡懒觉","写代码"]
};
p1 只有三个属性,其他都没有
数组也可以存储一组数组,但是不能更好表达语义
1.2 广义对象------万物皆对象
*DOM元素是一个对象
var box = document.getElementById("box");
box.name = "xiaoming";
box.age = 23;
box.sex = "mela";
DOM方法得到一个DOM元素,此时可以用打点语法给这个元素添加属性
你不能说box这个对象只有三个属性,因为box代表一个DOM对象
*function函数也是对象
function fn() {
alert("hello world");
}
fn.aa = 100;
fn.bb = 200;
*数组是对象
var arr = [10,30,20,40];
arr.name = "小红";
arr.sex = "女";
arr.hobby = ["跑步","看书","购物"];
*正则表达式(RegExp)是对象
var regexp = /\d/g;
regexp.num = 5;
*String() Number() 内置包装构造函数得到的值也是对象
var str = new String("hello");
1.3 基础类型不是对象
2 对象和json的区别
* json一定是对象 但对象不一定是json
json的属性名必须要加双引号""
普通对象对此没有要求
* 下面的键(属性名)都不符合命名规范,必须加引号
var obj = {
"-":"-",
"@@a":"@@a",
"2017":"2017",
"呵呵":"呵呵"
}
访问时,也必须加上双引号,用方括号表示法:obj["2017"],不能使用打点的方式
* 两个例子:
var obj = {
eve:999,
2017:888
};
var eve = 2015+2;
console.log(obj.eve); // 999
console.log(obj["eve"]);// 999
console.log(obj[eve]); // 888 js中[]能够把变量进行隐式转换 转成字符串
var obj2 = {
"true":555,
a: 666
}
var a = 7>3;
console.log(obj2.a); // 666
console.log(obj2["a"]); // 666
console.log(obj2[a]); //555
3 对象的方法
假如对象的某个属性值是一个函数,我们把这个属性叫做这个对象的的方法
function fn() {
alert("我们一直很努力");
}
var obj = {
a: 10,
b:function() { //即时函数
alert("666");
},
c:fn, //函数引用
d:["关羽","刘备","诸葛亮"],
birthday: {
year: 2017,
month: 10,
day: 1
}
}
4 函数上下文--------》this
var obj = {
name : "xiaoming",
age : 21,
sex : "mela",
sayHello : function() {
alert("大家好,我是"+this.name+",我今年"+this.age+"岁了!");
}
};
obj.sayHello();
*当一个函数当做对象的方法被调用时,这个函数里的this指的就是这个对象
所以sayHello函数的上下文就是obj对象,既函数内部this执行obj(this===obj)
var fun = obj.sayHello;
fun();
*直接用圆括号调用,不是对象打点调用,此时this===window
函数上下文是什么,取决于函数如何被调用,而不是函数如何定义
记住五条规律:
a 函数直接圆括号调用,函数上下文就是window对象
b 函数当做对象的方法被对象打点语法调用时,函数上下文就是该对象
c 函数是事件处理函数,函数上下文就是触发这个事件的对象
d 定时器调用函数,上下文是window对象
e 数组中存放的函数,被数组索引之后加圆括号调用,函数上下文this代表这个数组
5 课堂小测
两个概念:
1 arguments --- 函数的实参,是一个伪数组
2 arrguments.callee ---- 函数的形参,是一个伪数组
function fun(a,b,c,d,e) {
// this其实指的就是f函数的agruments对象 this.callee即f()的形参
alert(this.callee.length); //值得是f的形参个数 ---2
}
function f(a,b) {
arguments[0](10,20,30); //规律e
}
f(fun,5,6,7);