程序猿都没对象，JS竟然有对象？

　　现在做项目基本是套用框架，不论是网上的前端还是后端框架，也会寻找一些封装好的插件拿来即用，但还是希望拿来时最好自己过后再回过头了解里面的原理，学习里面优秀的东西，不论代码封装性，还是小到命名。

　　好吧，扯远了，在这里要讲的是大家前端用得多的JS，可能接触最多的是Jquery，但原生的JS最好还是要了解的，至少能看懂别人的代码，然后学习。

　　平时用得多的无非是if for 逻辑处理字符串，截断字符串，数组，然后是查找元素，对元素背景什么的属性操作，这些都是些实用性上的东西，这里讲一些更深入点的，如何理解Javascript对象。

　　C#，Java都是面象对象的语言，但JavaScript本身不是面向对象的语言，而是基于对象的语言。 JavaScript中所有事物都是对象， 包括字符串、数组、日期、数字，甚至是函数（验证方法是你可以在实例上 . 出属性）。

　　基于这点我们可以封装自己的插件，这里就不讲怎么制作插件了，想了解的可查询我的如何制作插件的文章。

创建对象，平时用到的方法：

var emptyObject1 = {};           //创建空对象
var emptyObject2 = new Object(); //创建空对象
var person = {"name":"sdcyst",
          "age":18,
          "sex":"male"};     //创建一个包含初始值的对象person
alert(person.name);              //sdcyst
alert(person["age"]);            //18

　　注意上面如何访问一个对象的属性，通过"."操作符获取对象的属性,必须得知道属性的名字.一般来说"[]"操作符获取对象属性的功能更强大一些,
　　可以在[]中放入一些表达式来取属性的值，比较有灵活性，如 name["name"+(i+1)];

　　delete操作符可以删除对象中的某个属性，判断某个属性是否存在可以使用"in"操作符，需要注意的是对象中的属性是没有顺序的。

var name = {"name1":"NAME1","name2":"NAME2","name3":"NAME3","name4":"NAME4"};
var namestring = "";
for(var props in name) {  //循环name对象中的属性名字
    namestring += name[props];
}
alert(namestring);  //NAME1NAME2NAME3NAME4
 
delete name.name1;  //删除name1属性
delete name["name3"];  //删除name3属性
namestring = "";
for(var props in name) {  //循环name对象中的属性名字
    namestring += name[props];
}
alert(namestring);  //NAME2NAME4
 
alert("name1" in name); //false
alert("name4" in name); //true

　　

　　接下来讲讲比较常见的数组，对象是无序数据的集合，而数组则是有序数据的集合，数组中的数据(元素)通过索引(从0开始)来访问，数组中的数据可以是任何的数据类型，数组本身仍旧是对象，创建数组可以用"[]"操作符，或者是用Array()构造函数来new一个。

var array1 = [];  //创建空数组
var array2 = new Array();  //创建空数组
array1 = [1,"s",[3,4],{"name1":"NAME1"}]; //
alert(array1[2][1]);  //4   访问数组中的数组元素
alert(array1[3].name1); //NAME1 访问数组中的对象
alert(array1[8]);   //undefined
array2 = [,,];  //没有数值填入只有逗号,则对应索引处的元素为undefined
alert(array2.length); //
alert(array2[1]);     //undefined

　　需要注意的是var array = new Array(10);初始化的长度10实际上对数组没有任何的约束力，数组的长度是可以任意改变的。

　　delete操作符删除数组的元素，注意这个删除仅仅是将数组在该位置的元素设为undefined，数组的长度并没有改变。

var array = new Array("n1","n2","n3","n4","n5");  //五个元素的数组
var astring = "";
for(var i=0; i<array.length; i++) {           //循环数组元素
    astring += array[i];
}
alert(astring);       //n1n2n3n4n5
delete array[3];                   //删除数组元素的值
alert(array.length + "_" + array[3])  //5_undefined
 
array.length = 3;    //缩减数组的长度
alert(array[3]);     //undefined
array.length = 8;    //扩充数组的长度
alert(array[4]);     //undefined

对象中也离不开函数，那如何创建函数:
　　function f(x) {........}
　　var f = function(x) {......}
上面这两种形式都可以创建名为f()的函数，不过后一种形式可以创建匿名函数。

　　方法的调用需要对象的支持，那么在方法中如何获取对象的属性呢？this！this关键字我们已经很熟悉了，在javascript的方法中，我们可以用this来取得对方法调用者(对象)的引用，从而获取方法调用者的各种属性。

var obj = {"name":"NAME","sex":"female"};
obj.print = function() {  //为对象添加方法
    alert(this.name + "_" + this["sex"]);
};
obj.print();  //NAME_female
obj.sex = "male";
obj.print();  //NAME_male

来一个更加面向对象的例子。

var person = {name:"defaultname",
              setName:function(s){
              this.name = s;
          },
          "printName":function(){
              alert(this.name);
          }}
person.printName();       //defaultname
person.setName("newName");
person.printName();       //newName

　　下面更深入点，每一个函数都包含了一个原型（prototype），我们可以简单的把prototype看做是一个模版，新创建的自定义对象都是这个模版（prototype）的一个拷贝。

通过prototype创建自定义对象的一个例子：

// 构造函数
        function Person(name, sex) {
            this.name = name;
            this.sex = sex;
        }
        // 定义Person的原型，原型中的属性可以被自定义对象引用
        Person.prototype = {
            getName: function() {
                return this.name;
            },
            getSex: function() {
                return this.sex;
            }
        }

创建自定义对象（实例化类）

var zhang = new Person("ZhangSan", "man");
console.log(zhang.getName());   // "ZhangSan"

当代码var zhang = new Person("ZhangSan", "man")执行时，其实内部做了如下几件事情：

• 1. 创建一个空白对象（new Object()）。
  2. 拷贝Person.prototype中的属性（键值对）到这个空对象中（我们前面提到，内部实现时不是拷贝而是一个隐藏的链接）。
  3. 将这个对象通过this关键字传递到构造函数中并执行构造函数。
  4. 将这个对象赋值给变量zhang。

　　上面我们提到了用new来创建一个对象的过程，事实上在这个过程中，当创建了空对象后，new会接着操作刚生成的这个对象的prototype属性。
　　每个方法都有一个prototype属性(因为方法本身也是对象)，new操作符生成的新对象的prototype属性值和构造方法的prototype属性值是一致的。构造方
法的prototype属性指向了一个prototype对象，这个prototype对象初始只有一个属性constructor，而这个constructor属性又指向了prototype属性所在的方
法。有点晕,看下面的图:

　　这样,当用构造函数创建一个新的对象时，它会获取构造函数的prototype属性所指向的prototype对象的所有属性。对构造函数对应的prototype对象所做的任何操作都会反应到它所生成的对象身上，所有的这些对象共享构造函数对应的prototype对象的属性(包括方法)。
看个具体的例子吧:

function Person(name,sex) {  //构造函数
    this.name = name;
    this.sex = sex;
}
Person.prototype.age = 12;   //为prototype属性对应的prototype对象的属性赋值
Person.prototype.print = function() { //添加方法
    alert(this.name+"_"+this.sex+"_"+this.age);
};
 
var p1 = new Person("name1","male");
var p2 = new Person("name2","male");
p1.print();  //name1_male_12
p2.print();  //name2_male_12
 
Person.prototype.age = 18;  //改变prototype对象的属性值,注意是操作构造函数的prototype属性
p1.print();  //name1_male_18
p2.print();  //name2_male_18

　　在javascript中,所有的方法都有一个call方法和apply方法。这两个方法可以模拟对象调用方法，它的第一个参数是对象，后面的参数表示对象调用这个方法时的参数。概念比较拗口，平时很少遇到，所以用得少，比较难得理解这里就不作过多的讲解了，请自行查找说得更明了的文章来了解吧。

　　以上示例部分整理于园友文章，用得比较明了所以拿来讲解，以上知识点可能只有在大家实际项目中运用的时候发现问题了，然后再来看，这时理解会更深入点，收藏起来作个备忘吧，有些源码等知识可进入园友公众号【一个码农的日常】自行查看。

　　再来一次前后照应，连JS都有对象，你为什么没有？！！！（说好的不要打脸……）