javascript 对象

常用内置对象

1. Object
2. Arguments
3. Array
4. String
5. Date
6. Error
7. Math
8. RegExp

常见对象

1. 字面量对象

var student = {
    // 属性
    name : 'test_name',
    age  : 10,
    sex  : '男',
    // 方法
    say  : function () {
        return 'say';
    },
    eat : function () {
        return 'eat';
    },
    study : function () {
        return 'study';
    }
};

// 使用对象
console.log( typeof student ); // 查看数据类型
console.log( student.name );   // 查看属性
console.log( student.study );  // 使用方法

2. JSON

var jsonData = {
    'name' : 'user1',
    'age'  : 18,
    'sex'  : '男'
    // json有两种数据形式 数组 和 对象,可以灵活嵌套使用
    'friends' : [
        {'name': 'user2'}, {'name':'user3'} , {'name':'user3'}
    ];
};
// 使用
console.log( jsonData.name );

字面量对象 和 json 对象的区别:

1. JSON对象的属性必须用引号硬起来,字面量对象可以省略
2. JSON本身是一种数据交换格式
3. JSON不能有方法,字面量对象可以有方法

3. for in 遍历对象

// 对象
var user = {
    name : 'user1',
    age  : 18,
    study: function () {
        return 'I can study';
    }
};
// for in 遍历并输出
for(var key in user){
    console.log(key + '=>' + user[key]);
}

4. 构造函数

构造函数 与 普通函数 的区别:

构造函数 可以产生对象 ,普通函数不能产生 对象

// 第一种方式: 传入多个值
function Person($name, $age) {
    this.name = $name;
    this.age  = $age;
    this.show = function () {
        return '我叫' + this.name + ',今年' + this.age +'岁!';
    }
}
var p1 = new Person('user1',18);
console.log(p1.show()); // 我叫user1,今年18岁!


 // 传入一个对象
function Person(option) {
    this.name = option.name;
    this.age  = option.age;
    this.show = function () {
        return '我叫' + option.name + ',今年' + option.age +'岁!';
    }
}
var p1 = new Person({ name : 'user1', age  : 18 });
console.log(p1.show()); // 我叫user1,今年18岁!

5. this 关键字

1. this 在哪个函数中 this 就代表谁
2. 谁调用,this 就是谁,永远指向调用者
3. 构造函数中的 this 始终是new关键字产生的当前对象

6. 构造器 Constructor

// 返回创建此对象的构造函数
function Person(options){
    this.name = options.name;
    this.age  = options.age;
    this.say = function () {
        return this.name + '=>' + this.age;
    }
}
var p1 = new Person({name : 'zs', age  : 18});
console.log( p1.constructor ); // 返回 function Person (){...}

6. 原形属性(对象) prototype

function Person(options){
    this.name = options.name;
    this.age  = options.age;
    this.say = function () {
        return '我叫'+this.name + ',今年' + this.age + '岁';
    }
}

// 利用 构造函数名.prototype.方法 动态为所有通过new Person产生的对象都添加属性或方法
Person.prototype.run = function () {
    return 'I can run';
}


// prototype 也可以为js内置对象添加属性和方法
Array.prototype.info = function () {
    console.log('这是通过 prototype 添加的方法,所有的数组对象都会有这个方法');
}

var arr = new Array();
arr.info();

var arr2 = [];
arr2.info();

注: 在构造函数中的属性和方法每一次通过 new 创建一个对象就会在内存中开辟新的空间

而通过 prototype 属性动态添加的不会每创建一个对象就在内存中开辟一个空间

注:由于用 prototype 属性动态添加的不会每创建一个对象就内存中开辟一个空间,这样一来就会覆盖原来的对象

// 构造方法
function Person (options){
    this._init(options);
}

Person.prototype = {
    // 初始化对象方法
    _init: function (options) {
        this.name = options.name
        this.age  = options.age;
    },
    say : function () {
        console.log( '我叫'+ this.name +',今年' + this.age + '岁' );
    }
};

var p1 = new Person({ name : 'user1', age  : 18 });
var p2 = new Person({ name : 'user2', age  : 20 });

// 通过 prototype 属性动态添加的不会每创建一个对象就开辟一个空间
console.log(p1.say === p2.say);

p1.say();

面向对象

面向对象的三大特性:

• 封装
• 继承
• 多态

闭包

闭包可以封闭作用域

闭包函数在定时时就自动执行

• 两种闭包

// 1. 函数内部返回一个函数

function test() {
    return function () {
        // ...
    }
}


// 2. 小闭包,函数自调用
(function (index) { // 形参
    // ...
})(i); // 实参

• 通过闭包实现高级排他

• 通过闭包实现(瀑布流布局节流函数)

function throttle (fn, delay) {
    var timer;
    return function () {
        clearTimeout = null;
        timer = setTimeout(fn, delay);
    }
}