JS学习笔记二（对象，包装类，原型，原型链，call/apply，继承模式，命名空间，对象枚举）

对象

1. 对象的创建方法：
   var obj = {} 对象字面量/对象直接量 对象字面量/对象直接量

2. 构造函数

• 系统自带的构造函数 Object() Array() Number()

var obj = new Object();
obj.name = 'abc';
obj.sex = 'female';
obj.say = function () {
}

• 自定义

语法规范：

大驼峰式命名规则（首字母大写）： 构造函数

构造函数内部原理

1. 在函数体最前面隐式的加上this = {}
2. 执行this.xxx = xxx
3. 隐式的返回this

包装类

new String(); new Boolean(); new Number();

<script>
   var num = 4;
   num.len = 3;
   // new Number(4).len = 3;  delete
   // new Number(4).len      
   console.log(num.len);  // undefined

</script>

<script>
   var str = "abcd";
   str.length = 2;
   // new String('abcd').length = 2; delete
   console.log(str);  // abcd
   // new String('abcd').length
   console.log(str.length);  // 4
</script>

<script>
  function Person(name, age, sex) {
      var a = 0;
      this.name = name;
      this.age = age;
      this.sex = sex;
      function sss() {
          a ++;
          document.write(a);
      }
      this.say = sss;
  }
  var oPerson = new Person();
  oPerson.say();
  oPerson.say();
  var oPerson1 = new Person();
  oPerson1.say();
  
</script>

输出结果： 121

<script>
    var x = 1, y = z = 0;
    function add(n) {
        return n = n + 1;
    }
    y = add(x);
    function add(n) {
        return n = n + 3;
    }
    z = add(x);

    console.log(y);
    console.log(z);
</script>

输出结果：4 4

原型

1. 定义：原型是function对象的一个属性，它定义了构造函数制造出的对象的公共祖先。通过该构造函数产生的对象，可以继承该原型的属性和方法。原型也是对象。
2. 利用原型特点和概念，可以提取共有属性。
3. 对象如何查看原型 ->隐式属性__proto__
4. 对象如何查看对象的构造函数——>constructor

原型链

1. 如何构成原型链？
2. 原型链上属性的增删改查
3. 绝大多数对象的最终都会继承自Object.prototype。注意：是绝大多数

Object.create(null)   // 这样就没有原型

4. Object.create(原型);

注意：

<script>
    var obj = Object.create(null);
    obj.toString = function () {
        return '呵呵';
    }
    document.write(obj); // 调用toString()方法

</script>

输出： 呵呵

bug1:

可正常计数范围：小数点前后16位

call/apply

1. 作用，改变this指向。
2. 区别，后面传的参数形式不同。
   call 需要把实参按照形参的个数传进去
   apply需要传一个arguments

<script>
    function Person(name, age, sex) {
        this.name = name;
        this.age = age;
        this.sex = sex;
    }
    function Student(name, age, sex, tel, grade) {
        Person.call(this, name, age, sex);
        this.tel = tel;
        this.grade = grade;
    }
    var student = Student('sunny', 123, 'male', 139, 2017);

</script>

继承模式，命名空间，对象枚举

继承发展史

1. 传统形式 -->原型链
   过多的继承了没用的属性

<script>
    Grand.prototype.lastName = "Ji";
    function Grand() {

    }
    var grand = new Grand();
    Father.prototype = grand;
    function Father() {

    }
    var father = new Father();

    Son.prototype = father;
    function Son() {

    }
    var son = new Son();
</script>

2. 借用构造函数
   不能继承借用构造函数的原型
   每次构造函数都要多走一个函数

<script>
    function Person(name, age, sex) {
        this.name = name;
        this.age = age;
        this.sex = sex;
    }
    function Student(name, age, sex, tel, grade) {
        Person.call(this, name, age, sex);
        this.tel = tel;
        this.grade = grade;
    }
    var student = Student('sunny', 123, 'male', 139, 2017);
</script>

3. 共享原型
   不能随便改动自己的原型

<script>
    Father.prototype.lastName = "Deng";
    function Father() {
    }
    function Son() {
    }
    function inherit(Target, Origin) {
        Target.prototype = Origin.prototype
    }
    inherit(Son, Father)
    var son = new Son();
</script>

4. 圣杯模式

<script>
    function inherit(Target, Origin) {
        function F() {
        }
        F.prototype = Origin.prototype
        Target.prototype = new F();
        Target.prototype.constuctor = Target;
        Target.prototype.uber = Origin.prototype;
    }
    Father.prototype.lastName = "Deng";
    function Father() {
    }
    function Son() {
    }

    inherit(Son, Father)
    var son = new Son();
    var father = new Father();
</script>

圣杯模式高级写法：

<script>
    var inherit = (function () {
        var F = function () {};
        return function (Target, Origin) {
            F.prototype = Origin.prototype;
            Target.prototype = new F();
            Target.prototype.constuctor = Target;
            Target.prototype.uber = Origin.prototype;
        }
    }());
</script>

命名空间

管理变量，防止污染全局，适用于模块化开发

<script>
    var deng = {
        food1 : { name :"apple"},
        food2 : { name : "fish"},
        food3 : { name : "water"},
        eatFood : function (num) {
            return this['food'+num];
        }
    }
</script>

deng.food1 == deng[‘food1’]

对象枚举

for in

<script>
    obj = {
        a : 123,
        b : 234,
        c : 456
    }
    for(var key in obj){
        // console.log(obj.key)  //undefined    obj.key --> obj['key']
        console.log(obj[key])

    }
</script>

hasOwnProperty

判断是不是自己的属性

<script>
    obj = {
        a : 123,
        b : 234,
        c : 456,
        __proto__ : {
            lastName : "deng"
        }
    }
    Object.prototype.abc = 'aaa';
    for(var key in obj){
        if(!obj.hasOwnProperty(key)) {
            console.log(obj[key])
        }
    }
</script>

输出：
deng
aaa

in

判断能不能在对象上调用属性

instanceof

A instanceof B
看A对象的原型链上有没有B的原型

问题：

var arr = {};
var arr = [];

区分 arr 是数组还是对象
方法1：arr.constructor
方法2：arr instanceof Array
方法3： Object.prototype.toString.call(arr);

推荐用方法3。 方法1和方法2 用在父子域上回返回false。