面向对象心得笔记(一)

一、面向对象 OOP: object oriented programming
对象,是一组无序的属性集合
1.狭义对象:一般用花括号定义的{ } 动态添加属性,属性也可以访问(主要还 是狭义对象)
如何访问对象属性值 1.对象.属性名 2.对象.属性名[i]
2.广义对象:window、Date日期、Math数学方法…

二、基本数据类型与引用数据类型
基本类型:number、null、undefined、string、boolean。
引用类型:对象可以通过大点方式添加属性 ,但是基本类型不可以用
区别:
1.是否可以添加、设置属性
2.在JScript中基本数据类型不能添加属性,也不能拿到属性值。只有对象类 型可以

三、json与狭义对象的区别
json是一种数据格式 //json天生为了数据而生。前端从后台拿到的的数据就基本是接送格式

 var p1 {
          "name":"xzd", 
           //属性名必须加双引号(不是单引号) ,
          //对象在这里可以不加双引号(不加双引号就是一个对象)
          "age":12
     }

json的属性必须加双引号(不是单引号),json严格的JScript对象。
一般狭义对象是不加双引号的,但是也有特殊,例如下面这个不加就不行了
(一些属性名特殊那些,不符合命名规范的我们就要加双引号,否则就报错)。

var obj {
        "~~":"2019,
        "国籍":"china",
        "2018":2018
        }

四、对象中的方法
对象不仅可以保存普通的值(静态),还可以存储函数(动态)
静态数据:1.对象名.属性名 2.对象名.属性名[i]
动态数据:1.对象名.方法() === var a = 对象.方法 (后面这个方法不能加括号()了)
这里的方法也就是对象里面的某一个属性
**五、函数上下文(重点难点)**主要就是下面5点
什么叫函数上下文?说白了就是"this"代表什么?
1.函数假如是圆括号执行,函数上下文就是window

 var a = 100;
        function fn(a,b,c,d,e,f) {
            var a = 200;
            console.log(this.a); //100
        }
        fn(1,3,5,7,9,11); 
        //函数假如是圆括号执行,函数上下文就是window  this就是window,所以a就是100

2.函数作为事件处理函数 ,函数上下文就是这个事件触发的对象

 function changeColor() {
            this.style.background = "green";
            console.log(this); // 
此时this代表的是事件源 点击哪个div,this就代表该div } var divs = document.querySelectorAll("div"); for(var i=0; i

3.函数作为对象的方法,对象打点调用,那么函数上下文就是这个对象

  function say() { 函数作为对象的方法(下面的对象中正好有一个人方法是你的函数)
            console.log(this.say); // 此时this就是obj,所以this.say === obj.say
        }
        var obj = {
            name:"xzd",
            age:12,
            sex:"m",
            say:say
        }
        // say();  //空 window.say没有
        obj.say(); //xzd  对象obj来调用  函数上下文就是这个对象

4.定时器函数上下文是window,定时器里面和外面的this不一样

var divs = document.querySelectorAll("div");
    for(var i=0; i < divs.length; i++) {
        //循环遍历每一个div
        divs[i].onclick = function() {
            console.log(this); //事件外:this代表事件源
var that = this; // 定时器外面 事件外:this代表事件源
。所以我们先用一个变量that来把它记住。后面就用that来代替this setInterval(function() { console.log(this); //this不行, this默认就是window 怎么改? // this.style.background = "red"; //this === window,所以用this不行 that.style.background = "red"; // },100); } }

5.函数作为数组元素,被索引出来执行,函数上下文就是这个数组

   function fn() { //该函数正好是数组中的某一个元素
            console.log(this);  //(5) [ƒ, 1, 2, 3, 4]
            console.log(this.length);  // 5
        }
        var arr = [fn,1,2,3,4]; 
        arr[0](); //小括号前面是数组,所以this就代表数组

你可能感兴趣的:(JavaScript)