HTML之JavaScript对象声明

HTML之JavaScript对象声明

复制代码
常用:
        方式1:
            new Object()  创建一个空对象
        方式2:
            {属性名:属性值,属性名:属性值,...函数名:function(){}}  创建一个对象
html 复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        /*
        Java中是先有类,然后实例化出对象;js没有类,直接声明处理对象
            方式1:
                new Object()  创建一个空对象
            方式2:
                {属性名:属性值,属性名:属性值,...函数名:function(){}}  创建一个对象
        */
    //    方式1:
       var person = new Object();
       // 对象的属性? 添加属性
        person.name = '张三';// 有name属性,就是修改赋值,没有name属性则增加name属性并赋值(太草了随意的一批)
        person.age = 18;
        var age = 11;// 这里是全局变量,不是对象的属性
       // 对象的方法? 添加方法
       person.eat = function(food){
           console.log(this.age+',默认age,'+age+'吃饭:'+food);//此处使用age属性,this指向当前对象,不加this就会使用全局变量age
       }

       // 访问属性
       console.log(person.name);
       console.log(person.age);
       // 调用方法
       person.eat('面条');// 调用方法


    //    方式2:
      var age = 15;
       var person1 = {
           "name":'李四', // 为了后续迎合json格式,属性名加上双引号
           "age":20,
           "eat":function(food){
               console.log(this.age+'吃饭:'+food+"age"+age);// 此处的age不加this就会使用全局变量age
           }
       }
       console.log(person1.name);
       console.log(person1.age);
       person1.eat('米饭');

    </script>
</head>
<body>
    
</body>
</html>
相关推荐
qq. 28040339844 小时前
CSS层叠顺序
前端·css
喝拿铁写前端4 小时前
SmartField AI:让每个字段都找到归属!
前端·算法
猫猫不是喵喵.4 小时前
vue 路由
前端·javascript·vue.js
烛阴5 小时前
JavaScript Import/Export:告别混乱,拥抱模块化!
前端·javascript
bin91535 小时前
DeepSeek 助力 Vue3 开发:打造丝滑的表格(Table)之添加行拖拽排序功能示例12,TableView16_12 拖拽动画示例
前端·javascript·vue.js·ecmascript·deepseek
GISer_Jing5 小时前
[Html]overflow: auto 失效原因,flex 1却未设置min-height &overflow的几个属性以及应用场景
前端·html
程序员黄同学5 小时前
解释 Webpack 中的模块打包机制,如何配置 Webpack 进行项目构建?
前端·webpack·node.js
拉不动的猪5 小时前
vue自定义“权限控制”指令
前端·javascript·vue.js
再学一点就睡5 小时前
浏览器页面渲染机制深度解析:从构建 DOM 到 transform 高效渲染的底层逻辑
前端·css
拉不动的猪6 小时前
刷刷题48 (setState常规问答)
前端·react.js·面试