zoukankan      html  css  js  c++  java
  • js入门之对象

    一、对象理解

    现实世界 万物皆对象, 一切事物都是对象 对象还是一个具体的事物
    
    对象: 特征和行为组成  特征是名词 用来描述对象的, 行为是动词
    
    程序中的对象
    是对现实世界中事物的抽象
    1. js中的对象其实就是生活中的一个抽象
    2. js中的对象是一个无序属性的集合
    3. 其属性可以包含基本值,对象或函数,对象就是一组没有顺序的值
    4. 对象的行为和特征
        行为: 方法 
        特征: 属性
    
    如何创建一个对象, 如何使用对象的成员
    对象: 属性和方法 称为成员
    
    this在对象中代表的是当前对象

    1.字面量创建对象

    var dog = {
            name: 'puppy',
            type: '中华田园犬',
            age: 2,
            color: 'yellow',
            bark: function () {
                console.log(this.name + 'wang wang wang')
            },
            eat: function () {
                console.log(this.name + '啃骨头')
            }
        }
    
    属性访问
    console.log(dog.name);
    console.log(dog.type);
    
    另一种访问属性的方法
    console.log(dog['name']);
    
    方法访问
    dog.bark();
    dog.eat();
    
    函数和方法的区别
    函数: 独立存在的就是函数    函数名()  调用
    方法: 属于对象的函数 对象名.方法()  调用

    2. new Object创建对象并动态添加属性

    2. new Object()
    Object 是一个构造函数
    new的方式来调用的构造函数
    new Object() 调用构造函数 会在内存中创建一个对象
    
    // 动态添加属性和方法
        var hero = new Object(); 创建一个空对象
        hero.name = 'huangzhong';
        hero.weapon = ''攻击;
        hero.equipment = ['tk','gj','kj'];
        hero.attack = function () {
            console.log(this.name +':attack lalala')
        }
        hero.attack();

    3. 工厂函数创建对象

    function createHero (name,weapon,equipment,blood) {
            var hero = new Object(); 
            // 返回一个空的对象
            hero.name = name;
            hero.weapon = weapon;
            hero.equipment = equipment;
            hero.blood = blood;
            hero.attack = function () {
                console.log(this.name + ': 攻击')
            }
            return hero;
        }
    
        var hero1 = createHero('huangzhong','gongjian',['toukui','xuezi'],100);

    4.自定义构造函数创建对象

    命名: 遵从帕斯卡规则, 第一个单词的第一个姊妹大写,后续的每个单词首字母大写
    function Hero(name,weapon,equipment,blood) {
            // this 动态给对象增加成员  this 指向当前对象
            this.name = name;
            this.weapon = weapon;
            this.equipment = equipment;
            this.blood = blood;
            this.attack = function () {
                console.log(this.name + 'attacking')
            }
        }
    
        var hero1 = new Hero('huangzhong','gongjian','toukui',100)

    二、 new关键字和this

    1. new关键字的执行过程

    1. 在内存中创建了一个空的对象
    2. 让构造函数中的this指向刚刚创建的对象
    3. 执行构造函数, 在构造函数中设置函数和方法
    4. 返回了当前对象

    2. this出现的三个地方

    1. 在方法中  this 指向的是这个方法所属的对象
    2. 函数中    指向window
    3. 构造方法中  this就是构造函数中创建的对象

    三、对象的操作案例

    案例1:  for in 遍历对象

    var obj = {
            name: 'zs',
            age: 18,
            sex: 'male',
            sayHi: function () {
                console.log(this.name + ': hello');
            }
        }
        for (var key in obj) {
            console.log(key + '---' + obj[key]);
        }
    View Code

    添加属性

    for (var i = 0; i < 10; i++) {
            o['a' + i] = i * 2
        }
    View Code

    删除成员delete

    var o = {
            name: 'abc',
            say: function () {
            }
        }
    console.log(o.name);
    delete o.name;
    console.log(o.name);
    View Code
  • 相关阅读:
    第三次作业成绩
    现代程序设计 作业6
    动态期末成绩
    课堂作业成绩公布(游戏服务器以及客户端设计)
    第二次作业(homework-02)成绩公布
    指定长度,页面显示换行
    java学习流程
    对象比对
    开发语言转型
    Asp.Net 自定义储存Session方式
  • 原文地址:https://www.cnblogs.com/guniang/p/11987255.html
Copyright © 2011-2022 走看看