首页 > 其他分享 >JS — 对象、数组、函数

JS — 对象、数组、函数

时间：2025-01-17 19:34:49浏览次数：1  
标签：console log JS person 数组 test main 函数

对象

  • 英文名称：Object。

  • 类似于C++中的map，python中的字典，由key:value对构成。

  • value可以是变量、数组、对象、函数等。

  • 函数定义中的this用来引用该函数的“拥有者”。

例如：
test.js中的内容为：

let person = {  // 定义一个对象person
    name:'kitty',  // 对象的元素可以是变量
    age:18,
    money:0,
    friends:['Alice', 'Bob', 'Lucy'],  // 对象的元素可以是数组
    clothes:{  // 对象的元素可以是对象
        color:"pink",
        price: 100,
    },
    add_money:function(x){  // 对象的元素可以是函数
        this.money += x;  // this:返回拥有这个函数的对象，这里指person
    }
}

function main(){
    console.log(person);
}

export {
    main
}

test.html中的内容为：

<body>
    <script type="module">
        import {main} from "/test/test.js";

        main();
    </script>
</body>

对象属性与函数的调用方式（访问对象的值的方式）：

1. 点的方式，person.name、person.add_money()

2. 中括号的方式，person["name"]、person["add_money"]()

例如：
test.js中的内容为：

let person = {  // 定义一个对象person
    name:'kitty',  // 对象的元素可以是变量
    age:18,
    money:0,
    friends:['Alice', 'Bob', 'Lucy'],  // 对象的元素可以是数组
    clothes:{  // 对象的元素可以是对象
        color:'pink',
        price: 100,
    },
    add_money:function(x){  // 对象的元素可以是函数
        this.money += x;  // this:返回拥有这个函数的对象，这里指person
    }
}

function main(){
    // 1. 点的方式，类似于c++中的class类
    console.log(person.name, person.age, person.clothes); // kitty 18 {color:'pink',price: 100}

    // delete person.name;  // 删除对象的属性
    
    console.log(person.money);  // 0
    person.add_money(10);  // 调用函数
    console.log(person.money);  // 10


    // 2. 中括号的方式
    console.log(person["money"]);  // 10

    person["add_money"](10);  // 调用函数
    console.log(person["money"]);  // 20

}

export {
    main
}

test.html中的内容为：

<body>
    <script type="module">
        import {main} from "/test/test.js";

        main();
    </script>
</body>

数组

  • 数组是一种特殊的对象，用中括号[ ]表示。

  • 类似于C++中的数组，但是数组中的元素类型可以不同。

  • 数组中的元素可以是变量、数组、对象、函数。

例如：
test.js中的内容为：

let a = [1, 2, "a", "kitty", [3, 4, 5]];

let b = [
    1,  // 变量
    "kitty",  // 变量
    ['a', 'b', 3],  // 数组
    function () {  // 函数
        console.log("Hello World");
    },
    { name: "kitty", age: 18 }  // 对象
];

let c = [];  // 定义一个空数组
let d = {};  // 定义一个空对象（没有任何成员的对象）

let main = function() {
    console.log(a);
    console.log(b);
    console.log(c);
    console.log(d);
}

export {
    main
}

test.html中的内容为：

<body>
    <script type="module">
        import {main} from "/test/test.js";

        main();
    </script>
</body>

访问数组中的元素：

  • 通过下标，从0开始访问。

例如：
test.js中的内容为：

let a = [1, 2, "a", "kitty", [3, 4, 5]];

let b = [
    1,  // 变量
    "kitty",  // 变量
    ['a', 'b', 3],  // 数组
    function () {  // 函数
        console.log("Hello World");
        return 0;  // 如果不加这句话，执行函数后返回undefined
    },
    { name: "kitty", age: 18 }  // 对象
];

let main = function() {
    console.log(b[0]);  // 访问数组b[]的第0个元素，返回 1
    console.log(b[2][1]);  // 返回 b
    console.log(b[3]);  // 返回函数的定义： ƒ () { console.log("Hello World");return 0; }
    console.log(b[3]());  // 执行函数，返回 Hello World   0
    console.log(b[4].name)  // 返回对象的元素，返回 kitty 
    // 或者 console.log(b[4]['name']);

    b[0] = function() {  // 给b的第0个元素重新赋值为函数
        console.log("哈哈哈");
    }

    b[0]();  // 执行函数b[0]，返回 哈哈哈

}

export {
    main
}

test.html中的内容为：

<body>
    <script type="module">
        import {main} from "/test/test.js";

        main();
    </script>
</body>

数组的常用属性和函数：

  • 属性length：返回数组长度。注意length是属性，不是函数，因此调用的时候不要加()

  • 函数push()：向数组末尾添加元素

  • 函数pop()：删除数组末尾的元素

  • 函数splice(a, b)：删除从a开始的b个元素

  • 函数sort()：将整个数组从小到大排序

  • 自定义比较函数：array.sort(cmp)，函数cmp输入两个需要比较的元素，返回一个实数，负数表示第一个参数小于第二个参数，0表示相等，正数表示大于。

test.js中的内容为：

let a = [5, 4, 1, 3, 2];

let b = [
    1,  // 变量
    "kitty",  // 变量
    ['a', 'b', 3],  // 数组
    function () {  // 函数
        console.log("Hello World");
        return 0;  // 如果不加这句话，执行函数后返回undefined
    },
    { name: "kitty", age: 18 }  // 对象
];

let main = function() {
    console.log(b.length);  // 返回数组的长度，返回5

    b.push(5);  // 在末尾添加新的元素
    console.log(b);

    b.pop();  // 删除最后一个元素
    console.log(b);

    a.sort();  // 排序（从小到大），返回[1, 2, 3, 4, 5]
    console.log(a);

    a.sort(function(a, b) {  // 逆序（从大到小），返回[5, 4, 3, 2, 1]
        return b - a;
    })
    console.log(a);

    a.splice(1, 2);  // 删除从下标1开始的2个元素，返回[5, 2, 1]
    console.log(a);

}

export {
    main
}

test.html中的内容为：

<body>
    <script type="module">
        import {main} from "/test/test.js";

        main();
    </script>
</body>

函数

  • 函数是用对象来实现的。

  • 函数与C++中的函数类似。


函数的定义方式：

例如：
test.js中的内容为：

// 第一种定义方式
function add(a, b) {
    return a + b;
}

let main = function() {
    console.log(add(3, 4));
}

export {
    main
}

test.js中的内容为：

// 第二种定义方式
let add = function(a, b) {
    return a + b;
}

let main = function() {
    console.log(add(3, 4));
}

export {
    main
}

test.js中的内容为：

// 第三种定义方式
let add = (a, b) => {
    return a + b;
}

let main = function() {
    console.log(add(3, 4));
}

export {
    main
}

test.html中的内容为：

<body>
    <script type="module">
        import {main} from "/test/test.js";

        main();
    </script>
</body>

返回值：

  • 如果未定义返回值，则返回undefined。

标签：console,log,JS,person,数组,test,main,函数
From： https://www.cnblogs.com/kitty-38/p/18677480

相关文章

  • 数组的算法
    逆序算法时间复杂度n选择排序算法 时间复杂度n^2冒泡排序算法 时间复杂度n^2原地插入排序 时间复杂度n^2二分查找法 前提是数组有序一维字符数组：初始化charc[5]={'H','e','l','l','o'};花括号里的元素个数必须小于数组长度，大于会造成越界访问；小于则会......
  • node.js Koa框架学习记录2
    在上一篇文章我们初步学习了写一个简单的接口，这次对目录结构以及统一数据格式，异常错误的处理目录结构优化：前端请求方法错误，我们可以通过在app.use(router.routes())后面追加一个use，告诉前端请求方法错了，而不是404Notfound：app.use(router.routes()).use(router.allowedMe......
  • 去掉数组中重复的元素。
    #include<stdio.h>#include<stdlib.h>//函数用于移除数组中的重复元素并返回新数组的大小intremoveDuplicates(int*arr,intsize,int**newArray){if(size<=0)return0;//动态分配内存给新的数组*newArray=(int*)malloc(size*sizeof(int));......
  • Java初学者笔记-03、代码块内部类函数式编程
    代码块静态代码块static{}类加载时自动执行，类只会加载一次，静态代码块只会执行一次，往往用来对类的静态资源的初始化。实例代码块{},每次创建对象时执行，用来完成对象的初始化的。内部类一个类定义在另一个类内部，叫做内部类。使用场景：当一个类的内部，包含了一个完整的事物，且......
  • linux m、mm、mmm函数和make的区别
    在Linux内核开发和Android开发中，构建系统通常使用 make 命令来编译和构建项目。而在Android开发环境中，还有 m、mm 和 mmm 等命令，这些命令是Android构建系统的一部分，提供了更高效和便捷的构建方式。以下将详细介绍这些命令的功能、使用场景和区别。一、make 命令......
  • Java初学者笔记-03、代码块内部类函数式编程
    代码块静态代码块static{}类加载时自动执行，类只会加载一次，静态代码块只会执行一次，往往用来对类的静态资源的初始化。实例代码块{},每次创建对象时执行，用来完成对象的初始化的。内部类一个类定义在另一个类内部，叫做内部类。使用场景：当一个类的内部，包含了一个完整的事物，且......
  • NodeJS“学雷锋”志愿者管理系统-计算机毕设 附源码 39269
    NodeJS“学雷锋”志愿者管理系统目 录摘要1绪论1.1研究背景与意义1.2开发现状1.3论文结构与章节安排2 “学雷锋”志愿者管理系统系统分析2.1可行性分析2.1.1技术可行性分析2.1.2经济可行性分析2.1.3操作可行性分析2.2系统功能分析2.2.1功......
  • 使用 pdf.js 通过文件流方式加载pdf文件
    关于Pdf.js的基础知识，请参考我的博客 使用pdf.js在网页中加载pdf文件使用pdf.js跨域问题的处理方法    上面两篇博客中介绍的内容都是基于直接加载远程服务器中静态PDF文件（即URL地址）来渲染PDF的，实际业务场景中，如与第三方系统对接过程中，第三方系统不直接公开......
  • LossVal：一种集成于损失函数的高效数据价值评估方法
    在机器学习领域，训练数据的价值并非均等：部分训练数据点对模型训练的影响显著高于其他数据点。评估单个数据点的影响程度通常需要反复重训练模型，计算效率低下。LossVal提出了一种创新方法，通过将数据价值评估过程直接集成到神经网络的损失函数中，实现了高效的数据价值评估。现代机器......
  • java 函数式编程
    1函数式创建对象new接口或抽象类时在花括号里面补全缺失的函数体可以创建匿名子类对象（非子类匿名对象）new普通类时在花括号里面直接重写方法可以创建匿名子类对象（非子类匿名对象）2lumbda表达式创建对象在函数式创建对象的基础上当接口或抽象类中仅有一个方法缺少函数体时可以......

赞助商

阅读排行

网站主页关于我们联系我们网站地图

本网站内容转载自其他媒体，侵权联系[admin##ips99.com]。

Copyright © 2020-2023 IPS99 版权所有 IPS99