发表于: 2018-07-13 23:22:42

1 766


今天完成的事情:还是在继续看书补各种基础,js的各种内容如果不能融会贯通挺难受的。


明天计划的事情:还是继续看书以及抄代码


遇到的问题:有的时候会搞不清楚哪些单词是类似于css中的类名可以自己设置并赋予它属性,又有哪些单词是属于js中本来就存在的,有自己特定作用的,另外js的书写方式真的是需要花时间去适应的,很多时候想法是有了,但是不知道如何通过js代码把逻辑体现出了,急不得啊


收获:

一、对象的定义:

  对象是JavaScript的一个基本数据类型,是一种复合值,它将很多值(原始值或者其他对象)聚合在一起,可通过名字访问这些值。即属性的无序集合。

二、对象的创建(多种方法)

  1、对象直接量 / 字面量

  

       var obj = {
           name: 'lyl',
           age: 18
       }
       console.log(obj.name); // lyl

  2、构造函数:

    (1)、系统自带的的, eg: new Object(), Array(), Number(),Boolean(), Date()...

    

 var obj = new Object();
      obj.name = 'lyl';
      console.log(obj.name); //lyl

     (2)、自定义的:为了和普通函数区分,首字母大写,采用大驼峰式写法(普通函数采用小驼峰式写法)

复制代码
复制代码
       function Obj (name) {
          this.name = name;
          this.age = 18;
      }
      var obj = new Obj('lyl');
      console.log(obj.name); //lyl
      console.log(obj.age); //18
复制代码
复制代码

    自定义构造函数的基本构造原理:

      首先,文字理论解释一番,其实一切的关键全在与new这个操作符上,用new和不用new返回的结果大相径庭。不用new,则Obj('lyl')根本就是一个函数的正常执行,没有返回值,则默认返回undefined,而是用new操作符后js引擎就会将该函数看作构造函数看待,经过内部的一系列隐士操作,返回值就是一个对象了。

      看下如下demo:

  demo1:用new和不用new的区别演示:

复制代码
复制代码
function Obj () {
          this.age = 18;
      }
    //   不用new
      console.log(Obj()); // undefined
    //  用new
      console.log(new Obj()); //Obj {age: 18}
复制代码
复制代码

  demo2 用new返回值为对象的基本原理:

  不用new,函数内的this指向的是window,所以this.xxx定义的变量都是window上的属性,但为什么使用new后其中的this就不是window对象了呢?那是因为

  用new后,js引擎会在函数被进行两步隐士操作(假设构造函数名为Person):第一步, var this = Object.create(Peson.prototype);   (也是创建对象的一种方法,下边会讲到)  隐士的改变函数内this的含义,现在函数内的this是一个原型为Person.prototype, 构造函数为Person的对象(其实此过程就将想要的对象基本创造成功了,只是差些属性而已,从此可是看出构造函数创建对象的最根本原理是借用Object.create()方法来实现的,只不过被封装功能化了); 第二步, 在创建的对象设置完所需要的属性后,隐士的将创建的对象this通过return返回  return this; 

  

  通过代码的展现:

复制代码
复制代码
 //  构造函数的原型
     Person.prototype = {
       say: function () {
         console.log('I am saying');
       }
     }

    //  构造函数
     function Person () {
      //  隐士操作
      // var this = Object.create(Person.prototype);
      
      //返回对象属性的设置
        this.name = 'lyl';
        this.age = 18;

      //  隐士操作
        // return this;
     }

     var person1 = new Person();
     console.log(person1.name); // lyl
     person1.say(); //I am saying



返回列表 返回列表
评论

    分享到