Javascript 函数和对象

【六】函数

  • 函数(Function)是一种可重复使用的代码块,用于执行特定的任务或计算,并可以接受参数和返回值。

【1】函数声明

function functionName(parameter1, parameter2, ...) {// 函数体// 执行特定的任务或计算// 可以使用参数进行操作// 可以使用 return 语句返回值
};

【2】函数调用

  • 无参函数直接调用
    • func()
  • 有参函数,传递指定参数
    • 参数个数可以超过(python中会报错)
function myFunc(a, b){console.log(a, b);
};
myFunc(1);	//1 undefined
myFunc(1, 2);	//1 2
myFunc(1, 2, 3); //1 2

(1)argument

  • arguments 是一个特殊的对象,它包含了函数调用时传递的所有参数。
    • arguments 对象类似于数组,它有一个 length 属性表示传递的参数个数,并且可以通过索引访问每个参数的值。
    • 但它并不是真正的数组类型,因此不支持数组的所有方法。
    • 如果需要像数组那样操作参数,可以将其转换为真实的数组(如 Array.from(arguments) 或者使用扩展运算符 ...)。
function myFunc(a, b){console.log(arguments);
};
myFunc(1);//Arguments [1, callee: ƒ, Symbol(Symbol.iterator): ƒ]
myFunc(1, 2)//Arguments(2) [1, 2, callee: ƒ, Symbol(Symbol.iterator): ƒ]
myFunc(1, 2, 3)//Arguments(3) [1, 2, 3, callee: ƒ, Symbol(Symbol.iterator): ƒ]
  • 应用:
    • 限制传递参数个数
    • 累加
function myFunc(a, b){if (arguments.length > 2){console.log("参数过多");}else if(arguments.length < 2){console.log("参数不够");}else {console.log(a, b);};
};
myFunc(1);
myFunc(1, 2, 3);
myFunc(1, 2);
function mySum(){var total = 0;for (num of Array.from(arguments)){total += num;};console.log(total)
};
mySum(); //0
mySum(1, 2, 3, 4); //10

【3】函数返回值

(1)默认返回值undefined

function func(){};
console.log(func()); //undefined

(2)只能有一个返回值

function divmod(a, b){return parseInt(a%b), a-parseInt(a%b)*b;
};
var res = divmod(8, 3);
console.log(res); //2
  • 以数组的形式返回多个值
function divmod(a, b){return [parseInt(a/b), a-parseInt(a/b)*b];
};
var res = divmod(8, 3);
console.log(res); //[2, 2]

【4】全局变量和局部变量

  • 和python一样

(1)定义

  • 全局变量:

    • 全局变量是在函数外部声明的变量,可以在程序的任何地方访问和使用。
    • 全局变量的作用域是整个程序,它在程序执行期间一直存在。
    • 全局变量可以在不同的函数中共享和修改。
  • 局部变量:

    • 局部变量是在函数内部声明的变量,只能在函数内部访问和使用。
    • 局部变量的作用域仅限于声明它的函数内部。
    • 局部变量在函数执行期间存在,并在函数执行结束后被销毁。
    • 不同函数中可以使用相同名称的局部变量,它们彼此之间互不影响

(2)示例

var a = 10;
function outer(){var a = 100;function inner(){console.log(a);};return a;
}
outer(); //100
console.log(a); //10
var a = 10;
function func1(){console.log(a)};
function func2(){var a = 100;return func1
};
func2()(); //10
console.log(a); //10

【5】匿名函数

(1)定义

  • 匿名函数是一种没有名称的函数,它可以在需要的地方直接定义和使用,而无需为其指定一个函数名。
  • 匿名函数通常以函数表达式的形式出现,可以被赋值给变量、作为参数传递给其他函数或立即执行。
  • 和python的lambda一样
var functionName = function(parameters) {// 函数体
};

(2)示例

  • 没有函数名,直接运行
(function(){console.log("hello world")})();
//hello world
  • 函数名调用
var divmod = function(a, b){return [parseInt(a/b), a - parseInt(a/b)*b]};
console.log(divmod(9, 2));
//(2) [4, 1]

【6】箭头函数

(1)定义

  • 箭头函数是ES6(ECMAScript 2015)引入的一种新的函数声明方式,它提供了一种更简洁的语法来定义函数。

  • 箭头函数通常被称为"fat arrow"函数,因为箭头 => 的形状像一个胖胖的箭头。

  • 箭头函数的特点

    1. 简洁的语法:相对于传统的函数声明方式,箭头函数提供了更简洁的语法形式。
    2. 没有自己的 this:箭头函数没有自己的 this 值,它继承父级作用域的 this 值。
    3. 没有 arguments 对象:箭头函数也没有自己的 arguments 对象,但可以通过剩余参数(rest parameters)来获取传递给函数的参数。

(2)示例

  • 无参数的箭头函数
var greet = () => {console.log("hello world")};
greet(); //hello world
  • 单个参数的箭头函数
var square = x => {return x*x};
square(10); //100
  • 多个参数的箭头函数
var sum = (a, b) => {return a + b};
sum(10, 15); //25

【七】对象

  • 在 JavaScript 中,对象是一种复合值,它可以包含多个属性(键值对)。
  • 可以理解为python的字典,但是更像python的object有.方法

【1】创建对象

(1)简单

  • 对象字面量
var obj = {};
obj["name"] = "bruce";
obj.age = 18;
//{name: 'bruce', age: 18}
  • 使用new关键字
var obj = new Object();
obj.name = "bruce";
obj.age = 18;
//{name: 'bruce', age: 18}

(2)复杂

  • 构造函数
    • 自定义一个创建具体对象的构造函数,函数内部不需要new构造的过程,直接使用this代替对象进行属性和方法的书写,也不需要return一个返回值
    • 使用时利用new关键字调用自定义的构造函数就可以了
    • 一般构造函数首字母需要大写
function Info(name, age){this.name = name;this.age = age;this.introduce = function(){console.log(`my name is ${this.name}, my age is ${this.age}`);}
};
var person = new Info("bruce", 18);
//Info {name: 'bruce', age: 18}

【2】对象调用

(1)访问属性

  • 在对象内部
    • 使用this
  • 在对象外部
    • 直接使用.
    • 使用索引
    • for in遍历,这里只能索引
function Info(name){this.name = name;this.identify = "normal";this.allInfo = `${this.name}-${this.identify}`;this.introduce = () => {console.log(`my name is ${this.name}, my identify is ${this.identify}`);};
}
var p1 = new Info("bruce")
p1.name;	//'bruce'
p1["identify"]; //'normal'
p1.allInfo; //'bruce-normal'
for (key in p1){console.log(p1[key]);
}
/*
bruce
normal
bruce-normal
() => {console.log(`my name is ${name}, my identify is ${identify}`);}
*/    

(2)访问方法

  • 对象内调用
    • this
  • 对象外调用
    • 直接.
    • 索引
function Obj(name){this.name = name;this.upName = function(){return this.name.toUpperCase()};this.introduce = () => {console.log(`my big name is ${this.upName()}`)};
}
var p1 =  new Obj("bruce");
p1.upName(); //'BRUCE'
p1["introduce"](); //my big name is BRUCE

【3】日期对象

  • Date 对象用于在脚本中处理日期和时间。

(1)创建时间对象

  • 无参数
var date = new Date();
//Thu Feb 22 2022 19:31:22 GMT+0800 (中国标准时间)
  • 日期字符串参数
var date = new Date("2022-02-02");
//Wed Feb 02 2022 08:00:00 GMT+0800 (中国标准时间)
  • 数值多参数
var date = new Date(2022,2,2,10,10,10);
//Wed Mar 02 2022 10:10:10 GMT+0800 (中国标准时间)

(2)内置方法

2.1获取日期和时间信息
var date = new Date()date.getFullYear();
// 获取年份(四位数)
date.getMonth();
// 获取月份(0-11)(0表示一月,11表示十二月)
date.getDate();
// 获取日(月中的某一天)
date.getDay();
// 获取星期
date.getHours();
// 获取小时
date.getMinutes();
// 获取分钟
date.getSeconds();
// 获取秒数
date.getMilliseconds();
// 获取毫秒数
date.getTime();
// 获取时间戳
2.2设置日期和时间
var date = new Date();date.setFullYear(2018); 
// 设置年份
date.setMonth(8); 
// 设置月份(从0开始)
date.setDate(8); 
// 设置日期(月中的某一天)
date.setHours(18); 
// 设置小时
date.setMinutes(45); 
// 设置分钟
date.setSeconds(8); 
// 设置秒数
2.3格式化时间
var date = new Date();var formattedDate = date.toLocaleDateString(); 
// 格式化为本地日期字符串
var formattedTime = date.toLocaleTimeString(); 
// 格式化为本地时间字符串
var formattedDateTime = date.toLocaleString(); 
// 格式化为本地日期和时间字符串

【4】Json对象

  • JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,它是以易于阅读的方式存储和交换数据的。
  • JSON 是纯文本,并且完全是语言无关的。

(1)序列化

  • 和python的json.loads()一样

  • JSON.stringify(value, replacer, space)

    • value 参数是必需的,表示要转换的 JavaScript 值。
    • replacer 参数是可选的,可以是函数或者数组,用来控制如何转换值。
    • space 参数也是可选的,用来插入额外的空格到输出的 JSON 字符串中,以提高可读性。
var obj = {name: "bruce", age: 18, 
};
var myJSON = JSON.stringify(obj, null, 4);
console.log(myJSON); 
/*
{"name": "bruce","age": 18
}
*/

(2)反序列化

  • 和python的json.dumps()一样

  • JSON.parse(text, reviver)

    • text 参数是必需的,表示要解析的 JSON 字符串。
    • reviver 参数是可选的,是一个函数,用来对解析生成的对象进行变换。
var myJSON = '{"name":"bruce", "age":18}';
var obj = JSON.parse(myJSON);
console.log(obj.name);  
//bruce

【5】正则对象

(1)创建正则对象

  • 字面量语法/pattern/modifiers
  • 构造函数语法:`new RegExp(pattern, modifiers)``
  • ``pattern 是要匹配的模式,modifiers` 是可选的修饰符,用于改变搜索模式。常见的修饰符:
    • g:全局匹配;查找所有匹配,而不是在找到第一个匹配后停止。
    • i:不区分大小写匹配。
    • m:多行匹配;在到达一行文本末尾时还会继续查找下一行是否存在与模式匹配的情况。
let pattern = /pattern/modifiers
let pattern = new RegExp(pattern, modifiers)

(2)常用方法

2.1.test()
  • 这是 RegExp 对象的方法,用于测试给定的字符串是否符合正则表达式的模式。它返回布尔值。
let pattern = /bruce/;
pattern.test("my name is bruce");
//true
2.2.exec()
  • 这是 RegExp 对象的方法,它返回一个数组,其内容是匹配的第一个结果。
  • 如果没有匹配,返回 null。
var str = "my name is bruce";
let pattern1 = /e/;
pattern1.exec(str);
//['e', index: 6, input: 'my name is bruce', groups: undefined]
let pattern1 = /z/;
pattern1.exec(str);
//null
2.3.match()
  • 这是 String 对象的方法,它返回一个数组,其内容是被找到的所有匹配。
  • 需要配合全局匹配使用
  • 如果没有匹配,返回 null。
  • str.match(regexp)
var str = "my name is bruce";
let pattern1 = /e/g;
str.match(pattern1);
//(2) ['e', 'e']
let pattern1 = /z/g;
str.match(pattern1);
//null
2.4.replace()
  • 这也是 String 对象的方法,它返回一个新的字符串。
  • 这个新字符串是通过用替换文本替换与正则表达式匹配的子字符串来生成的
var str = 'my name is bruce';
let pattern1 = /e/;
str.replace(pattern1, 'ee');
//'my namee is bruce'
2.5search()
  • 这是 String 对象的方法,它测试字符串对象与正则表达式的匹配情况,并返回匹配的第一个索引,如果没有找到任何匹配的文本则返回-1。
var str = '没my name is bruce'
let pattern1 = /e/;
str.search(pattern1);
//6

(3)存在的问题

3.1全局模式存在指针移动
  • 将上述test方法的模式改为全局匹配
let pattern = /bruce/g;
pattern.test("my name is bruce"); //truce
pattern.test("my name is bruce"); //false
pattern.test("my name is bruce"); //true
pattern.test("my name is bruce"); //false
  • 在 JavaScript 的正则表达式中,全局模式(g)会导致正则表达式对象维护一个“lastIndex”属性,这是下一次匹配开始的位置。这个属性的存在使得正则表达式对象在连续的搜索操作中,会从上次匹配后的位置开始继续匹配,这就是所谓的“指针移动”。
  • 这种行为主要在 exectest 方法中体现,而不是 match 方法。当你使用 exectest 方法进行全局搜索时,每次匹配后,都会更新 lastIndex 属性。
let pattern = /bruce/g;
pattern.lastIndex; //0
pattern.test("my name is bruce"); //truce
pattern.lastIndex; //16
pattern.test("my name is bruce"); //false
pattern.lastIndex; //0
pattern.test("my name is bruce"); //true
3.2不给定参数
  • RegExp 对象的方法不给定参数
  • JavaScript 会将参数默认为 undefined。然后,test() 方法会将这个 undefined 转换为字符串 "undefined"
let pattern = /e/;
pattern.test(); //true
let pattern = /a/;
pattern.test(); //false

【6】math对象

(1)方法

abs(x)      返回数的绝对值。
exp(x)      返回 e 的指数。
floor(x)    对数进行下舍入。
log(x)      返回数的自然对数(底为e)。
max(x,y)    返回 x 和 y 中的最高值。
min(x,y)    返回 x 和 y 中的最低值。
pow(x,y)    返回 x 的 y 次幂。
random()    返回 0 ~ 1 之间的随机数。
round(x)    把数四舍五入为最接近的整数。
sin(x)      返回数的正弦。
sqrt(x)     返回数的平方根。
tan(x)      返回角的正切。

(2)示例

console.log(Math.floor(4.99)); //4console.log(Math.log2(1024)); //10

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/702540.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

H5/CSS 笔试面试考题(91-100)

简述div 元素的哪些 CSS 属性的默认值为 0 ( ) A:border-top-width B:outline-width C:padding-top D:margin-top 面试通过率:76.0% 推荐指数: ★★★ 试题难度: 初级 试题类型: 选择题 答案:c、d 简述下列关于背景定位属性 background-position 说法正确的是 ( ) A:…

嵌入式学习笔记总结Day24

今天进入了下一个阶段的学习——进程与线程的学习 今天主要了解了进程的相关知识以及linux系统中对进程进行控制的一些函数接口 一、概念 程序:存放在外存中的一段数据组成的文件 进程&#xff1a;是一个程序动态执行的过程&#xff0c;包括进程的创建、进程的调度、进程的消…

【人工智能高频面试题--基本篇】

&#x1f680; 作者 &#xff1a;“码上有前” &#x1f680; 文章简介 &#xff1a;人工智能高频面试题 &#x1f680; 欢迎小伙伴们 点赞&#x1f44d;、收藏⭐、留言&#x1f4ac; 人工智能高频面试题--基本篇 1.深度学习和过往的神经网络训练方法有什么区别&#xff1f;列举…

Linux互斥体的驱动程序测试

一. 简介 上一篇文章学习如何在驱动代码中使用互斥锁。文章地址如下: Linux内核中处理并发与竞争的互斥体的驱动实现-CSDN博客 本文对所实现的驱动进行测试。确定互斥锁是否实现对 Led设备的互斥访问,即一次只能一个应用程序访问Led设备。 二. Linux互斥体的驱动程序测试…

LED流水灯实验

#include "reg52.h" #include <intrins.h> //包含函数_crol_,_cror_ typedef unsigned int u16; //对系统默认参数重新定义 typedef unsigned char u8; #define LED_PORT P2 //使用宏定义P2端口 void delay_10…

Panalog大数据日志审计系统libres_syn_delete.php命令执行漏洞

声明 本文仅用于技术交流&#xff0c;请勿用于非法用途 由于传播、利用此文所提供的信息而造成的任何直接或者间接的后果及损失&#xff0c;均由使用者本人负责&#xff0c;文章作者不为此承担任何责任。 1、产品简介 Panalog大数据日志审计系统定位于将大数据产品应用于高校…

Element UI 组件的安装及使用

Element UI是基于Vue.js 的一套企业级的前端UI 组件库&#xff0c;它包含了丰富的UI组件供开发者使用&#xff0c;极大的提高生产效率。这篇文章将帮你快速了解Element UI的安装和使用。 一、安装 Element UI 首先&#xff0c;你需要在你的环境中安装Node.js&#xff0c;因为…

【.xml文件匹配不到】⭐️解决使用mybatis-plus找不到对应的xml文件导致的持久层方法报错

前言 小伙伴们大家好&#xff0c;很快嗷&#xff0c;到了年后的第一周&#xff0c;最近在自己电脑上敲项目时遇到一个平时可能不怎么遇到的问题&#xff0c;就是mybatis持久层框架使用时找不到对应的xml配置文件&#xff0c;也就导致自己写的持久层方法报错 接口报错内容&…

win11修改网络算法为BBR2_提升网络环境质量

Win11 BBR2 是Google开发的一种高效的网络拥塞控制算法&#xff0c;玩 Linux 的朋友应该对它还有锐速不陌生。相比Windows默认使用的 CUBIC 算法&#xff0c;BBR2 在网络吞吐量、延迟、全局性能等方面都有一定优势。 如果你日常网络经常丢包或者高延迟可以尝试切换为BBR2算法。…

实施工程师前后端项目部署流程一次完成

目录 一、jdk安装具体步骤 二、tomcat安装具体步骤 三、MySql具体步骤 修改密码 登录 四、nginx安装 4.1、Nginx 4.2、操作步骤 安装ssl证书&#xff08;https&#xff09; 开80端口 测试 设置自启动 五、后端部署tomcat负载均衡 5.1、为什么要使用 5.2、搭建ngin…

抖音视频提取软件怎么用|抖音数据抓取工具

针对用户获取抖音视频的需求&#xff0c;我们开发了一款功能强大的抖音视频提取软件&#xff0c;旨在帮助用户轻松获取他们感兴趣的视频内容。无需逐个复制链接&#xff0c;无需繁琐的下载步骤&#xff0c;我们的软件让抖音视频获取变得简单快捷。 使用我们的软件非常简单&…

Open3D 基于最小生成树的法线定向 (27)

Open3D 基于最小生成树的法线定向 (27) 一、算法介绍二、算法实现一、算法介绍 法线计算的方向通常都存在方向问题,用Open3D估计的点云法线,是在每个点的局部进行拟合,估计的法线方向并不一致,Open3D提供了使用最小生成树调整法线到统一方向的方法,下面是具体的实现代码…

停车场管理(C语言)

【题目描述】停车场管理。设有一个可以停放n辆汽车的狭长停车场&#xff0c;它只有一个大门可以供车辆进出。车辆按到达停车场时间的先后次序依次从停车场最里面向大门口处停放 (即最先到达的第一辆车停放在停车场的最里面) 。如果停车场已放满n辆车&#xff0c;则以后到达的车…

从Unity到Three.js(outline 模型描边功能)

指定模型高亮功能&#xff0c;附带设置背景颜色&#xff0c;获取随机数方法。 百度查看说是gltf格式的模型可以携带PBR材质信息&#xff0c;如果可以这样&#xff0c;那就完全可以在blender中配置好材质导出了&#xff0c;也就不需要像在unity中调整参数了。 import * as THRE…

从零实现一套低代码(保姆级教程)【后端服务】 --- 【22】实现数据库管理的前端页面

摘要 在上一篇中&#xff0c;我们实现了三个接口&#xff1a; 新增实体的接口删除实体的接口获取实体列表的接口 其实复杂的地方在于&#xff0c;我们创建一个实体&#xff0c;是在数据库中创建了一张表。而这张表中的数据&#xff0c;是要根据低代码平台中的操作进行更改。…

Qt中使用openGL

1. Qt与OpenGL的整合 Qt提供了QOpenGLWidget类&#xff0c;这是一个集成了OpenGL渲染能力的QWidget。通过使用QOpenGLWidget&#xff0c;开发者可以在Qt应用程序中嵌入OpenGL渲染的图形。QOpenGLWidget提供了一个框架&#xff0c;让OpenGL的渲染能够很好地集成在Qt的事件驱动模…

基于pytorch使用LSTM实现文本匹配任务

本文学习纪录 PyTorch深度学习项目实战100例 使用LSTM来实现文本匹配任务 使用LSTM&#xff08;Long Short-Term Memory&#xff09;网络来实现文本匹配任务是自然语言处理&#xff08;NLP&#xff09;中的一个常见应用。文本匹配任务的目标是确定两个文本段落是否在某种程度…

Vue + Echarts页面内存占用高问题解决

Vue Echarts页面内存占用高问题解决 1.问题描述 目前使用的是Vue2 Echarts4.x的组合&#xff0c;页面如下所示。 就是一个类似于神策的数据看板页面&#xff0c;左侧是一个导航栏&#xff0c;右侧看板页面中包含很多个报表图片&#xff0c;其中报表页面中对Echarts图表进…

挑战30天学完Python:Day21 类和对象

&#x1f389; 本系列为Python基础学习&#xff0c;原稿来源于 30-Days-Of-Python 英文项目&#xff0c;大奇主要是对其本地化翻译、逐条验证和补充&#xff0c;想通过30天完成正儿八经的系统化实践。此系列适合零基础同学&#xff0c;或仅了解Python一点知识&#xff0c;但又没…

[python][whl]pymc所有版本下载地址汇总

pymc-2.3.7-cp27-cp27m-win_amd64.whl下载地址&#xff1a;https://download.csdn.net/download/FL1623863129/88631556 pymc-2.3.7-cp35-cp35m-win_amd64.whl下载地址&#xff1a;https://download.csdn.net/download/FL1623863129/88631555 pymc-2.3.8-cp36-cp36m-win_amd64.…