Javascript面向对象基础一

    技术2022-05-20  41

    看了很多介绍javascript 面向对象技术的文章, 很晕. 为什么? 不是因为写得不好, 而是因为太深奥.javascript 中的对象还没解释清楚怎么回事, 一上来就直奔主题,/ 继承/ 原型/ 私有变量.... 结果呢, 看了大半天, 有了一个大概的了解, 细细一回味, 好像什么都没懂... 这篇文章是参考<<javascript-the definitive guide,5th edition>>7,8,9 章而写成的, 我会尽量按照原书的结构来说明javascript 的面向对象技术( 对象/ 数组-> 函数-->/ 构造函数/ 原型). ------------------------------------------------- 对象和数组(Objects and Arrays) 什么是对象? 把一些" 名字- 属性" 的组合放在一个单元里面, 就组成了一个对象. 我们可以理解为javascript 中的对象就是一些"-" 对的集合。" 名字" 只能是string 类型, 不能是其他类型, 而属性的类型则是任意的( 数字/ 字符串/ 其他对象..). 可以用new Object() 来创建一个空对象, 也可以简单的用"{}" 来创建一个 空对象, 这两者的作用是等同的.

    Js 代码 :

    var emptyObject1 = {};           // 创建空对象  

    var emptyObject2 = new Object(); // 创建空对象  

    var person = {"name":"sdcyst",  

              "age":18,  

              "sex":"male"};     // 创建一个包含初始值的对象person  

    alert(person.name);              //sdcyst  

    alert(person["age"]);            //18  

    var emptyObject1 = {};          // 创建空对象

    var emptyObject2 = new Object(); // 创建空对象

    var person = {"name":"sdcyst",

          "age":18,

          "sex":"male"};     // 创建一个包含初始值的对象person

    alert(person.name);              //sdcyst

    alert(person["age"]);            //18

      从上面的例子我们也可以看到,访问一个对象的属性,可以简单的用对象名加"." 后加属性的名字,也可以用"[]" 操作符来获取, 此时在[] 里面的属性名字要加引号, 这是因为对象中的索引都是字符串类型的.javasript 对象中属性的个数是可变的, 在创建了一个对象之后可以随时对它赋予任何的属性.

    Js 代码

    var person = {};  

    person.name = "sdcyst";  

    person["age"] = 18; 

    alert(person.name + "__" + person.age); //sdcyst__18  

    var _person = {name:"balala","age":23}; // 在构建一个对象时, 属性的名字可以不用引号来标注(name),  

          // 但是仍旧是一个字符串类型. 在访问的时候[] 内仍旧需要引号  

    alert(_person["name"] + "__" + person.age); //balala__23  

    alert(_person[name]);                   //undefinied 

    var person = {};

    person.name = "sdcyst";

    person["age"] = 18;

    alert(person.name + "__" + person.age); //sdcyst__18

     

    var _person = {name:"balala","age":23}; // 在构建一个对象时, 属性的名字可以不用引号来标注(name),

         // 但是仍旧是一个字符串类型. 在访问的时候[] 内仍旧需要引号

    alert(_person["name"] + "__" + person.age); //balala__23

    alert(_person[name]);                   //undefinied

      通过"." 操作符获取对象的属性, 必须得知道属性的名字. 一般来说"[]" 操作符获取对象属性的功能更强大一些, 可以在[] 中放入一些表达式来取属性的值, 比如可以用在循环控制语句中,"." 操作符则没有这种灵活性。

    Js 代码

    var name = {"name1":"NAME1","name2":"NAME2","name3":"NAME3","name4":"NAME4"};  

    var namestring = "";  

    for(var props in name) {  // 循环name 对象中的属性名字  

        namestring += name[props]; 

    }  

    alert(namestring);  //NAME1NAME2NAME3NAME4  

    namestring = "";  

    for(var i=0; i<4; i++) {  

        namestring += name["name"+(i+1)]; 

    }  

    alert(namestring);  //NAME1NAME2NAME3NAME4  

    var name = {"name1":"NAME1","name2":"NAME2","name3":"NAME3","name4":"NAME4"};

    var namestring = "";

    for(var props in name) {  // 循环name 对象中的属性名字

        namestring += name[props];

    }

    alert(namestring);  //NAME1NAME2NAME3NAME4

     

    namestring = "";

    for(var i=0; i<4; i++) {

        namestring += name["name"+(i+1)];

    }

    alert(namestring);  //NAME1NAME2NAME3NAME4

     delete 操作符可以删除对象中的某个属性, 判断某个属性是否存在可以使用"in" 操作符.

    Js 代码

    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  

    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

      需要注意, 对象中的属性是没有顺序的. 对象的constructor 属性 每一个javascript 对象都有一个constructor 属性. 这个属性对应了对象初始化时的构造函数( 函数也是对象).

    Js 代码

    var date = new Date();  

    alert(date.constructor);  //Date  

    alert(date.constructor == "Date");  //false  

    alert(date.constructor == Date);  //true  


    最新回复(0)