JavaScript——对象

对象

1. 对象？

万物皆对象，对象是一个具体的事物，人、狗、菜可以是对象；一个数据库、一张网页、一个远程服务器的连接也可以是”对象“。

在JavaScript中，对象是一组无序的相关属性和方法的集合，所有的事物都是对象，例如字符串、数值、数组.函数等。

对象是由属性和方法组成的

• 属性：事物的特征，在对象中用属性来表示(常用名词）
• 方法：事物的行为，在对象中用方法来表示（常用动词）

2. 为什么需要对象

对象可以表达结构更清晰，更强大。

创建对象的三种方式

通过字面量创建对象

        //1.利用字面量创建对象{}
        var obj = {
                uname: 'Feliks',
                age: 18,
                sex: '男',
                sayFK: function() {
                    console.log('FKU');
                }
            }
            //a.里面的属性或者方法采取键值对的形式 键 属性名 : 值 属性名
            //b.多个属性或者方法中间用 逗哈 隔开
            //c.方法冒号后面跟的是一个匿名函数
            //2.使用对象
            //a. 对象名.属性名->调用对象的属性
        console.log(obj.uname);
        //b. 调用属性方法2 对象名['属性名']
        console.log(obj['age']);
        //c. 调用方法  对象名.方法名()
        obj.sayFK();

案例：修勾

        var dog = {
            name: '可可',
            type: '阿拉斯加',
            age: 5,
            color: 'blown',
            bark: function() {
                console.log('汪汪汪');
            },
            showFilm: function() {
                console.log('修沟的修勾，修勾在修沟');
            }
        }
        console.log(dog.name);
        console.log(dog['age']);
        console.log(dog.type);
        console.log(dog.color);
        dog.bark();
        dog.showFilm();

利用new Object创建对象

        var obj = new Object();
        obj.uname = 'feliks';
        obj.age = 20;
        obj.sex = '男';
        obj.sayFK = function(){
            console.log('fk u b!');
        }
        console.log(obj.uname);
        console.log(obj.sex);
        obj.sayFK();

构造函数创建对象

//为什么需要构造函数？
        //因为前面两种方式创建对象一次只能创建一个对象
        //因为我们一次创建一个对象，里面很多的属性和方法是相同的，我们只能复制
        //因此 我们可以利用函数的方法 重复这些相同的代码 我们把这个函数称为 构造函数
        //又因为这个函数不一样，里面封装的不是普通代码，而是对象
        //构造函数就是把我们对象里面一些相同的属性和方法抽象出来封装到函数里面

        //利用构造函数创建对象
        //构造函数语法格式
        // function 构造函数名(){
        //     this.属性 = 值;
        //     this.方法 = function(){}
        // }
        // new 构造函数名();//调用
        function Star(uname, age, sex) {
            this.uname = uname;
            this.age = age;
            this.sex = sex;
            this.sing = function(song) {
                console.log(song);
            }
        }
        var ldh = new Star('刘德华', 20, '男');
        var cgs = new Star('feliks', 20, '男');
        console.log(ldh);
        ldh.sing('冰雨');

        console.log(cgs.uname);
        console.log(cgs['age']);
        cgs.sing('afei');
        //1.构造函数名字首字母要大写
        //2.构造函数不需要return 就可以返回结果
        //3.调用构造函数 必须使用 new
        //4.我们只要new Star() 调用函数就创建一个对象{}
        //5.我们的属性和方法前面必须添加 this
        console.log('===============');
//案例
        function Hero(name, type, blood, fight) {
            this.name = name;
            this, type = type;
            this.blood = blood;
            this.fight = fight;
            this.skill = function(s) {
                console.log(s);
            }
        }
        var h1 = new Hero('廉颇', '力量', 500, '近战');
        var h2 = new Hero('后裔', '射手', 100, '远程');
        console.log(h1);
        console.log(h2);
        h1.skill('大招击飞');
        h2.skill('大鸟击飞');

我们利用构造函数创建对象的过程我们也称为对象的实例化

new 关键字

1. new 构造函数可以在内存中创建一个空的对象

2. this 就会指向刚才创建的空对象

3. 执行构造函数里面的代码 给这个空对象添加属性和方法

4. 返回这个对象（所以构造函数不需要return）

遍历对象

        //for...in遍历对象
        //for(变量 in 对象){}
        var obj = {
            uname: 'Feliks',
            age: 18,
            sex: '男',
            sayFK: function() {
                console.log('FKU');
            }
        }
        for (var key in obj) {
            console.log(key); //key输出变量 得到属性名
            console.log(obj[key]); //obj[key] 得到 属性值
        }

简易计算器

var flag = true;
  while (flag) {
    cal();
  }
  function cal() {
    var num = prompt('欢迎使用简易计算器：' + "\n" + 1 + '.' + '加法运算:' + "\n" + 2 + '.' + '减法运算:' + "\n" + 3 + '.' + '乘法运算:' + "\n" + 4 + '.除法运算:' + "\n" + 5 + '.退出:' + "\n" + '请输入您的选项:');
    if (num == 5) {
      flag = false;
      return;
    }
    var num1 = prompt('请您输入第一个数:');
    var num2 = prompt('请您输入第二个数:');
    switch (num) {
      case '1':
        alert(parseInt(num1) + parseInt(num2));
        break;
      case '2':
        alert(num1 - num2);
        break;
      case '3':
        alert(num1 * num2);
        break;
      case '4':
        alert(num1 / num2);
      default:
        alert('操作失败');
        break;
    }
  }