JavaScript基础篇-05 (对象)

1.为什么要用对象?

变量 :

只能存储一个值

数组 :

可以存储多个值 但是不能描述年龄.姓名… 很难区分

对象 :

可以理解为一种无序的数据集合 ,可以详细描述某个事物 ,现实中的任何事物 , 都可以通过代码的形式描述出来

2.通过字面量创建对象

1.对象的组成:

对象由属性和方法组成:
属性:信息或者特征(名词)
方法:功能或行为 (动词)
格式:

属性名与属性值之间用:分隔
多个属性用逗号分隔,

2.对象声明:

let 对象名={
属性名:属性值,
方法名:函数
}

let person = {
            name: '张学友',
            sayHi: function () {
                console.log('hi~~')

            },
            mtv: function (s) {
                console.log(s);
            }
        }
        //访问属性 得到值 对象.属性名
        console.log(person.name);
        //访问属性 得到值   对象['属性名']
        console.log(person['name']);
        //访问方法 对象.方法名()
        person.sayHi();
        //传参
        person.mtv(2);
        // 对象只能通过console.log 打印 不能在浏览器打印

属性名字可以加双引号也可以不加双引号。//一般不加

3.对象访问属性的两种方式

1.属性访问

对象.属性名
对象[‘属性名’]

// 两者方式有什么区别?
    // 1.点后面的属性名一定不要加引号
    // 2.[]里面的属性名一定要加引号
    //后期不同使用场景会用到不同的写法
2.方法访问

对象.方法

对象中的方法:
数据行为性的信息称为方法,一般是动词性的,其本质是函数
方法是依附在对象中的函数

        let x = {
            name: 'dx',
            age: 18,
            sing: function () {
                return '你好'
            },
            shoaw: function (str) {
                document.write(str)
            }
        }

        let a = x.name //对象也可以用变量接收  测试..
        console.log(a);//dx
        console.log(x.name)//dx
        console.log(x.age);//18
        console.log(x.sing());//你好

        x.shoaw('实参传参')
        //对象里的方法也可以传递参数

3. 对象中增删改查

        //1.创建一个空的对象
        let obj = {
            uname: '刘备',
        }

        //2.增 : 动态的给对象添加属性
        // 改 : 直接给对象里面的属性赋值 
        obj.uname = '曹操';//改
        obj.age = 58;//增
        obj['sex'] = '男'//增

        console.log(obj) //obj

        //3.给对象添加方法
        obj.say = function () {
            console.log('打刘备')
        }

        obj.say();//打刘备

        //4.删除对象属性 delete 对象.属性名
        delete obj.uname//删
        console.log(obj.uname)//uname 已被删除除 返回undefind

4. 数组对象

    //数组 里面可以存放任何的数据类型
    let arr =  [ ]
        //数组对象
        let students = [
            { name: '小明', age: 18, gender: '男' },
            { name: '小刚', age: 19, gender: '男' },
            { name: '小红', age: 20, gender: '女' },
        ]
        console.log(students[1].name);//小明
        // 怎么得到小明的名字
        //student[0] === 得到对象1
        //打印
        for (let i = 0; i < students.length; i++) {
            console.log(students[i].name);//小明 小刚 小红
            console.log(students[i].age);//18 19 20
        }

5. for …in 循环

  1. 遍历对象 : 一般对象里的方法不遍历
  2. for…in 语句用于对数组或者对象的属性进行循环操作。
  3. for … in 循环中的代码每执行一次,就会对数组的元素或者对象的属性进行一次操作。
    语法:

for (let 变量 in 对象){
//在此执行的代码
}
“变量”用来指定变量,指定的变量可以是数组元素,也可以是对象的属性。

      let obj = {
            uname: 'dx',
            age: 27,
            sex: 'girl',
            do: function () {
                return 'study';
            }
        }
        // k是 变量   便是对象里面的属性名
          for (let k in obj) {
            console.log(k); //得到每个属性名           
            //console.log(obj.k)  //变成了属性访问 对象.属性名  意思是找到obj里面的k属性 但是 k是不存在obj对象里的 所以会出现undefind
            //console.log(obj.['k']) //变成了属性访问 对象['属性名'] 意思是找到obj里面的k属性 但是 k是不存在obj对象里的 所以会出现undefind
            console.log(obj[k]); //
            //为什么这么写?
            //得到的是带字符串的属性名
            //  console.log(typeof k); 
            //k 等同于obj里面的每一个属性 k== uname k== age k==sex
            // obj[k] === obj['uname'] === obj['age'] === obj['sex']
        }

6.Math内置对象

Math.random 取随机数
        //Math.random() 生成随机数 [0,1); 包含0但不包括1之间的数

        function getRandomIntInclusive(min, max) {
            min = Math.ceil(min);
            max = Math.floor(max);
            return Math.floor(Math.random() * (max - min + 1)) + min; //含最大值,含最小值 
        }

        let random = getRandomIntInclusive(1, 10);
        console.log(random);
    console.log(Math.abs(-10));//10 取绝对值
    console.log(Math.min(1, 2, 4, 32, 4))//1 取一组数里面的最小值
    console.log(Math.max(3, 32, 31, 3));//32  取一组数里面的最大值
    console.logMath.ceil(10.1)//11  向上取整
    console.logMath.floor(10.1)//10 向下取整

随机点名案例:

    let students = ['赵云', '黄总', '张飞', '马超', '刘备', '曹操']
      	//2.调用随机函数 用变量接收  将数组索引作为实参传递给随机函数 参数是数组的第一位到第最后一位
        let index = getRandomIntInclusive(0, students.length - 1)
        //3.控制台打印
        console.log(students[index]);
        //4.删除自己
        students.splice(index, 1)
        //5.控制台打印数组检测
        console.log(students);
   /* 练习4: 猜数字游戏,设定次数,最多猜8次 */

        //1.生成0~100随机数 用变量接收
        let random = getRandomIntInclusive(0, 100)
        //2.定义次数
        let count = 0;
        //3.最多猜8次
        while (count < 8) {
            let num = + prompt('请输入数字')
            if (num > random) {
                alert('猜大了')
            } else if (num < random) {
                alert('猜小了')
            } else {
                alert('猜对了')
                break;
            }
            count++;
        }
        if (count >= 8) {
            alert('真笨,这都猜不到')
        }

打乱数组:


        let arr = [0, 1, 2, 3, 4];
        for (let i = 1; i < arr.length; i++) {
            let random = Math.floor(Math.random() * (i + 1));
            [arr[i], arr[random]] = [arr[random], arr[i]];
        }
        console.log(arr)

7.值传递与引用传递

空间小 读取速度快 : 简单数据存储到栈
空间大 读取速度慢 : 复杂数据存储到堆
在这里插入图片描述

在这里插入图片描述
在这里插入图片描述


        // 值传递:将一个变量的值赋值给另外一个变量 然后修改其中某一个变量的值 不会影响到另外一个变量

        let a = 10;
        let b = a;
        a = 20;
        console.log(b)//10

        // 引用传递:将一个变量的值赋值给另外一个变量 然后修改其中某一个变量的值 会影响到另外一个变量
        let obj1 = {
            uname: '齐天大圣'
        }
        let obj2 = obj1
        obj2.uname = '猪八戒'
        console.log(obj2.uname)//猪八戒
        console.log(obj1.uname)//猪八戒

在这里插入图片描述

每日鼓励自己一句话:
在这里插入图片描述

  • 2
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 2
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值