Js基础30:对象(下)

5、工厂函数创建对象

工厂？流水线，批量制造

 // 使用内置对象创建对象
 var obj = new Object();
 obj.name = '阿伟';
 obj.sayName = function(){
 console.log('你好，我叫阿伟');
 }

如果这段代码需要重复执行，是不是可以封装成函数

 function createObj() {
 var obj = new Object();
     obj.name = '阿伟';
     obj.sayName = function(){
         console.log('你好，我叫阿伟');
    }
 }

但是这样创建的对象，永远都是一个对象，这个时候应该想的到，抽取公共部分作为参数，可以传不同值进来，

我们需要得到这个封装好的对象，那么就需要返回这个对象。

 function createObj(name) {
     var obj = new Object();
     obj.name=name;
     obj.sayName = function(){
         console.log('你好，我叫'+name);
    }
     return obj;
 }

工厂函数的优点：值是活的，可以批量操作，减少重复代码。

6、使用对象的属性和方法

访问对象的属性：对象.属性;

调用对象的方法：对象.方法名(参数);

 // 得到对象的名字,属性可以当成变量使用
 console.log(obj.name);
 // 调用对象的方法，方法的本质是函数
 obj.sayName();

永远记住：只有对象才能点属性和方法

练习：

0. 用对象来描述，它的名字叫来福，它有黄色的毛hair，它有四条腿leg和一条尾巴tail，它喜欢吃骨头，喜欢跑到隔壁村找翠花
1. 创建三个学生对象，并且输出学生的学号、姓名、年级和年龄

7、键的方式访问对象的属性和有方法

语法：对象[属性名]

 var obj = {};
 obj['name'] = '狗蛋';
 obj['sayName'] = function(){
   console.log('你好，我叫' + obj['name']);
 }
 obj['sayName']();

8、遍历对象

语法：

 for(var key in obj){
     console.log(key);// 键名
     console.log(obj[key]); // 每个key对应的键值
 }

代码举例：

 var obj = {
   name : '狗蛋',
   age : 12,
   gender : '男'
 };
 for(var key in obj){
   console.log(key);
   console.log(obj[key]);
 }
 // 一般来说，需要我们处理的数据，只有属性没有方法

9、数据安全

之前学习函数的时候，函数可以创造一个局部作用域，把数据进行保护，不让外部的数据对我们的数据进行污染。

那么在有些情况下，就是需要使用全局变量，有不想造成全局变量的污染。。。那么怎么做的？

这里给大家介绍一个概念——对象封装！

 // 全局变量 全局作用域的函数，都可以封装进对象里，这样就只有一个全局变量了，就是我们创建的对象obj
 
 var obj = {
 myName:"阿伟",
     num:1,
     loginStatus:true
 }

总结：

1.对象不仅仅是一种语法，更是一种思想，一种方便解决问题的思想

2.使用对象来表示一个可以帮我做事的角色 ，我们只要调用对象的方法和属性，就能实现效果

3.对象语法使用属性描述事物的特征，使用方法描述事物的行为

练习：

 有数据
 var datas = [
        { name: '狗蛋', age: 18, gender: '男' },
        { name: '翠花', age: 19, gender: '女' },
        { name: '来福', age: 17, gender: '男' }
    ];
 
 根据上面的数据,在页面中显示一张表格,如下图

代码

  var datas = [
        { name: '狗蛋', age: 18, gender: '男' },
        { name: '翠花', age: 19, gender: '女' },
        { name: '来福', age: 17, gender: '男' }
    ]
 
     var str = `<table border="1">
                     <tr>
                         <th>姓名</th>
                         <th>年龄</th>
                         <th>性别</th>
                     </tr>`
     for (var i = 0; i <= datas.length; i++) {
         str += `<tr>`;
         var obj = datas[i]
         for (var key in obj) {
             str += `<td>${obj[key]}</td>`;
        }
         str += `</tr>`;
    }
     str += `</table>`;
 
     // 在页面中输出这个表格的字符串
     document.write(str);