记录一些JavaScript案例



    /* object  原始创建方式 */
        
    let am = new Object();  //没有赋值前是空值

    /* 这是赋值于变量名 */
    am.name = "小七";
    am.age = "19";
    am.job = "学生";

    am.sayName = function (){  //这个是this 当前对象
        console.log(this.name);  //指定某个值输出
    }

    console.log(am); //输出(打印)
    am.sayName();  //调用函数



    // /* object 简便式语句 */
    let name = "seven";

    let person = {
        name : "seven",   //赋值
        age :"18",    //赋值
        job : "student",  //赋值
        sayHi : function (){  //指定当前某个对象输出
            console.log(this.job);
        }
    }
        //输出 某个值
    console.log(person.name);  
    person.sayHi();  //调用函数体
    //这是对象名['l类型名'] 进行调用
    console.log(person['name']);  
    //修改数据
    person.age = "22";
    console.log(person);
    // 删除 数据
    delete person.name;
    console.log(person)
    //增加数据
    person.hobby = ['代码','爬山'];
    console.log(person);


    // /* 遍历对象 (for...in) */
    let amk = {
        name  : "hello",
        age : "25",
        //这是定义数据
        job : "student"
    };
    /* 遍历首推 */
    for(let key in amk){  //交换后,进行遍历
        //这个结构是用来找到每个数据
        console.log(amk[key]); //输出返回数据
        //返回后是独自占据一行
    }
    //  ↓ 会抛出警报,无法代遍历 (代迭)
    // for(let aml of amk){
    //     console.log(aml);
    // }


    /* 属性类型 */

    // configurable 可配置
    // enumerable  可枚举
    // writable 可写 可修改
    // value 属性值

    let obj = {};

    Object.defineProperty(obj,'name',{
        value: "小七",
        writable:false,  //为true时可以修改 false时不可修改
        configurable:false, //为真可删,为假不可删
        enumerable:true,  //为真时可调用,为假是不可调用
    })

    delete obj.name;  //
    console.log(obj);

    obj.name = 'hello';//
    console.log(obj);

    for(let am in obj){  //
        console.log(obj[am]);
    }


        /*  访问器属性:
            1.get:获取函数
            2.set:设置函数 
        */

    let obj = {  //这是一个对象
        age:50     //给予下列函数体一个值
    }    //这个这整体就是一个监听结构;
    Object.defineProperty(obj,'name',{
        get(){    //获取函数  值   会在获取时拦截
            if(this.age >30){  //假设age大于多少时返回什么
                return "hello";  //返回hello
            }
            return "world";     //小于30的话返回world
        },
        set(newValue){   //设置函数值  会在设置时拦截
            console.log("myName:" + newValue);  
        }    //输出,一个新的值
    })
        obj.name = '小七';  //这是 set 的设定值
        console.log(obj.name);  //输出 返回值


    /* 定义多个值 */

    let info = {};  //等同于一个容器
            // ↓这个属性是定义一个数据
    Object.defineProperties(info,{ 
        //以下是多个定义值
        name:{  //名字
            value:'小七',
        },
        age:{ //年龄
            value: 22,
            writable:true  //可修改
        },
        job:{  //职位
            value:'student' , 
        },
    })
    info.age = 23;  //修改内容
    console.log(info);//输出

    /* 检测属性 */

    //in 操作符
    let obj = {myName:"小七"};  //定义
    //1.数据真是存在为 true,,
    //2.数据未定义所以为false ,, 
    //3.in是在什么什么之内
   console.log('myName' in obj);  //  true
    console.log('age' in obj);   //  false


    /* has Own property  判断当前属性是不是对象自身的自有属性 */
    
    let obj = {myName:'小七',age:23};
    /* 如果是自己的内置属性或值返回true  没有反之,false */
    console.log(obj.hasOwnProperty('myName')); //true
    console.log(obj.hasOwnProperty('name'));//false
    
    
    /* 以上区别  暂时了解*/
        // 自己定义 数据
    let obj = {myName:'小鱼',job:'student'};

    /* 原型上的,在原型上添加 ↓ */
    Object.prototype.sayName = 'hello world';
    console.log(sayName);  //可以访问并返回 内容

        //用in判断是否存在原型上,结果是存在
    console.log('sayName' in obj);  //true
    //在用has own property  来判断它是不存在的
    console.log(obj.hasOwnProperty('sayName'));//false

    
    /* 对象安全防护 1.对象拓展 2.对象密封 3.对象冻结 */

    let obj = {myName:'小雨',job:'student'};
        // 这是形成了一个隔断,无法进行添加对像
    Object.preventExtensions(obj); //这个功能起到防止添加对象
        //  ↑这是对象拓展
        Object.seal(obj); // 这个功能起到阻止删除
        //   ↑这是对象密封
            Object.freeze(obj);  //这个功能起到禁止修改属性
        //   ↑这是冻结对象
    obj.age = 18;  //要添加的属性(值)
    obj.myName = 'hello world'; //要添加的属性(值)

    delete obj.job; //删除某个属性
    delete obj.myName; //删除某个属性
    console.log(obj);//输出  同时也可以单独获取某个元素


    // 实际应用 对象
    //实战案例:  图书编排

    let bookList = [
        {
            id:'001',
            bookList:'小区',
            name:'小七'
        },
        {
            id: '002',
            bookList: '中枢',
            name: '小雨'
        },
        {
            id: '003',
            bookList: '活着',
            name: '徐某'
        },
        {
            id: '004',
            bookList: '围城',
            name: '张某'
        }
    ]

    for(let i = 0;i<bookList.length;i++){

        // console.log(bookList[i]);
        console.log(`编号:${bookList[i].id}\n书名:${bookList[i].bookList}
        ---作者:${bookList[i].name}`);
    }







这是在学习上的一些记录和实验小案例,为什么放上来呢?开始的想法是方便复习;

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值