函数、匿名,箭头函数、对象、内置方法(日期和时间)、JSON对象,正则对象、Math对象

news/2024/10/11 12:07:41

【一】函数

【1】函数的语法格式

function 函数名 (参数) {代码体}
function 函数名(形参,形参,形参...){函数体代码
}

【2】函数的调用

  • 函数名 + ()
  • 函数调用时,会立即执行,代码体里面的代码
  • 可以多次调用,每次调用是独立不相关的
  • 函数的执行跟定义位置无关,只与调用的位置有关。

【3】函数的分类

(1)无参函数

// 无参函数
function func1(){console.log("无参函数....")
}func1()
// 无参函数....

(2)有参函数

// 有参函数
function func2(a,b){console.log(a,b)
};func2(1,2)
// 1 2

【4】函数的参数

  • 函数的阐述可以没有,可以是多个,多个参数之间用逗号分隔
  • 函数的参数根据书写位置的不同,名称也不同

(1)形式参数

  • 是定义在函数参数体力的参数

(2)实际参数

  • 在函数调用的时候传入的参数

【5】函数的返回值

(1)返回值机制

  • 函数内部通过return语句可以将计算结果或特定值返回给调用者。
function addNumbers(a, b) {return a + b;
}let result = addNumbers(3, 5); // result 的值为 8,因为函数返回了 a + b 的计算结果
console.log(result);
// 8

【6】终止函数运行

  • return除了用于返回值外,还可以用来提前结束函数的执行流程。
  • 当return被执行后,函数会立即停止剩余的代码执行,并直接返回指定的值。
function stopExecution() {if (false) { // 假设某个条件不成立return; // 结束函数执行}console.log('This line will not be executed');
}
stopExecution(); // 不输出任何内容,函数直接结束// This line will not be executed

【7】函数表达式

let multiplyByTwo = function(x) {return x * 2;
};console.log(multiplyByTwo(4)); // 输出: 8

【8】特殊的参数对象

function login(a,b,c){// arguments 参数是 函数内容的一个特殊的对象// 它能接收到函数调用时传递的所有参数并且带索引console.log(arguments) // [Arguments] { '0': 1, '1': 2, '2': 3 }console.log(a,b,c) // 1 2 3
}
console.log(login(1,2,3))function loginOne(a,b,c){if (arguments.length<3){console.log("参数不够")}else {console.log("参数多了")}console.log(arguments)console.log(a,b,c)
}
console.log(loginOne('a',5))
console.log(loginOne(4,5,6,7))
console.log(loginOne(4,5,'b'))//输出结果
参数不够
// 函数调用的时候传少了,有几个接受几个 剩余没有的全是 undefined
[Arguments] { '0': 'a', '1': 5 }
a 5 undefined
undefined参数多了
// 调用函数的时候参数穿多了也不会报错,而是有几个接受几个
[Arguments] { '0': 4, '1': 5, '2': 6, '3': 7 }
4 5 6
undefined参数多了
[Arguments] { '0': 4, '1': 5, '2': 'b' }
4 5 b
undefined

【二】匿名函数

  • 匿名函数,也称为无名函数或者lambda表达式

【1】语法

function() { /* 函数体 */ }

【2】示例

(function (){console.log("This is 匿名函数")
})

(1)调用匿名函数

  • 方式一:在定义匿名函数的时候用变量存起来
var add = (function (){console.log("This is 匿名函数")
})
add()
//输出结果
// This is 匿名函数
  • 方式二:直接在原本的函数身上进行自调用
console.log((function (a,b,c){console.log("This is abc匿名函数")return a*b*c
})(1,2,3)
)
// 输出结果
// This is abc匿名函数
// 6

【三】箭头函数

【1】语法

(1)单个参数

  • 箭头函数用于表示接受一个参数并直接返回该参数值的情况
  • 当只有一个参数时,可以省略括号(),但为了代码可读性,推荐保留
// 使用 =>
var func1 = (v) => v;
// 或者等价的传统写法
var func1 = function (v) {return v;
};

(2)多个参数

  • 如果需要处理多个参数,括号()不能省略,参数之间用逗号 ,分隔 返回值后面同样跟 =>
// 普通的有名函数
function add(a, b, c) {this._a = areturn a + b + c
}
console.log(add(1,2,3))
// 6// 在ES6中对上述的函数定义方式进行了扩充
// 用更简洁的代码来代替减轻代码量
var add = (a, b, c) => {// 在函数内部有一个自己的参数 叫 thisthis._a=athis._b=bthis._c=creturn this._a + this._b + this._c
}
console.log(add(2,3,4))
// 9

【四】对象

【1】定义对象的两种方式

// 【1】方式一:直接定义
var Data = {};
// 【2】方式二:通过内置函数构造对象
var ageData = new Object();
// 【3】构造函数构造对象
function Person(name,age){this.name=namethis.age=age
}
let person = new Person(name="chosen",age=20)
console.log(person,typeof person)
// 输出结果
// Person { name: 'chosen', age: 20 } object
var person = {name:"chosen",age:20,getAge:function (){return `i am ${this.name} and i am ${this.age}`;}
};console.log(person.name)
console.log(person.getAge())
//输出结果
chosen
i am chosen and i am 20

【2】对象的属性访问和修改

// Person { name: 'chosen', age: 20 } object
// 访问
console.log(person.name) // chosen
console.log(person.age) // 20// 修改
person.name = "max"
console.log(person.name) // max

【3】对象的方法属性

function Person(name,age){// 在函数内部的名称空间中只有 this 指定后才能在生成对象的时候被调用this.name =name// 方式一:先声明一个函数function add(a,b,c){return a + b + c}// 再用函数内部的 this 进行制定this.add = add// 方式二:直接使用 this 指向这个函数this.addOne = function (d,e,f){console.log(d)}// 方式三:使用箭头函数来指定this.addTwo = (g,h,i)=>{console.log(h)}
}
var Data = new Person(name="chosen",age=20)
console.log(Data.add(1,2,3)) // 6
console.log(Data.addOne()) // 9
console.log(Data.addTwo()) // 6
console.log(Data.name) // chosen
console.log(Data.age) // undefined(因为没有被this指定)

【4】索引访问以及遍历

// 可以按照索引式访问
console.log(Data["name"]) // chosen// 允许遍历
for (let item in Data){console.log(item)
}
//输出结果
name
add
addOne
addTwo

【五】内置日期对象Date

【1】创建日期对象

(1)创建当前日期和时间的对象实例

var date = new Date()
console.log(date)
console.log(date.toString())
// 2024-06-12T11:04:08.639Z
// Wed Jun 12 2024 19:08:46 GMT+0800 (中国标准时间)

(2)创建指定日期和时间的对象实例

var specificDate = new Date(2023, 6, 5, 10, 30, ); // 参数依次为年、月(从开始计数)、日、时、分、秒
console.log(specificDate)
console.log(specificDate.toString())
// 2023-07-05T02:30:00.000Z
// Wed Jul 05 2023 10:30:00 GMT+0800 (中国标准时间)

(3)获取当前的日期的号getDate()

console.log(date.getDate())
// 12

(4)获取当前的星期数getDay()

console.log(date.getDay())
// 3

(5)获取当地的标准时间toString()

console.log(date.toString())
// Wed Jun 12 2024 19:12:39 GMT+0800 (中国标准时间)

【2】内置方法

(1)获取日期和时间信息

let time = new Date();// 获取年份(四位数)
console.log(time.getFullYear());
// 获取月份(0-11)(0表示一月,11表示十二月)
console.log(time.getMonth());
// 获取日(月中的某一天)
console.log(time.getDate());
// 获取星期
console.log(time.getDay());
// 获取小时
console.log(time.getHours());
// 获取分钟
console.log(time.getMinutes());
// 获取秒数
console.log(time.getSeconds());
// 获取毫秒数
console.log(time.getMilliseconds());
// 获取时间戳
console.log(time.getTime());

(2)设置日期和时间

let date = new Date();console.log(date.setFullYear(2024)); // 设置年份
console.log(date.setMonth(8)); // 设置月份(表示一月,11表示十二月)
console.log(date.setDate(15)); // 设置日期(月中的某一天)
console.log(date.setHours(18)); // 设置小时
console.log(date.setMinutes(45)); // 设置分钟
console.log(date.setSeconds(30)); // 设置秒数
console.log(date) //  2024-09-15T10:45:30.945Z

(3)格式化时间

var date = new Date();var formattedDate = date.toLocaleDateString(); // 格式化为本地日期字符串
var formattedTime = date.toLocaleTimeString(); // 格式化为本地时间字符串
var formattedDateTime = date.toLocaleString(); // 格式化为本地日期和时间字符串console.log(date.toLocaleDateString()) // 2024/6/12
console.log(date.toLocaleTimeString()) // 19:24:07
console.log(date.toLocaleString()) // 2024/6/12 19:24:07

【七】JSON对象

  • 在js中也有序列化和反序列化方法

    • JSON.stringify() ----> dumps 序列化
    • JSON.parse() -----> loads 反序列化
var data = {'name': "chosen","age": 22
}
console.log(data, typeof data)
// { name: 'chosen', age: 22 } object// 【1】将 js 中的对象类型转换为 json’‘ 字符串
var dataStr = JSON.stringify(data)
console.log(dataStr, typeof dataStr)
// {"name":"chosen","age":22} string// 【2】将 json’‘ 字符串 转换为 js 中的对象类型
var dataObj =JSON.parse(dataStr)
console.log(dataObj, typeof dataObj)
// { name: 'chosen', age: 22 } object

【八】正则对象

  • 正则表达式(Regular Expression)是一种用来匹配、查找和操作字符串的工具。

  • 在JavaScript中,我们可以使用RegExp对象来创建和操作正则表达式。

【1】方式一

let reg = new RegExp(正则表达式);

【2】方式二

let reg1 = /正则表达式/

【3】正则方法介绍

(0)数据准备

var dataStr = "Hello World!"

(1)test()

  • 用来检测匹配是否有结果,返回值是布尔值
var pattern = /Hello/
var patternOne = /max/
console.log(pattern.test(dataStr)) // true
console.log(patternOne.test(dataStr)) // false

(2)exec()

  • 搜索匹配内容,返回值是数组类型
  • 如果没有匹配内容,返回 null
var patternTwo = /l+/g
console.log(patternTwo.exec(dataStr))
// 输出结果
[ 'll', index: 2, input: 'Hello World!', groups: undefined ]

(3)match()

  • 搜索正则表达式内容 返回值也是数组类型
  • 如果没有匹配内容,返回 null
var str = "Hello, world!";
var pattern = /l+/g;
var result = str.match(pattern);
console.log(result); // ["ll", "l"]

(4)search()

  • 匹配正则表达式 返回值是匹配到的第一个的索引位置
  • 如果没有匹配内容,返回 -1
var str = "Hello, world!";
var pattern = /lo/;
var result = str.search(pattern);
console.log(result); // 输出:3

(5)replace()

  • 替换指定字符,并返回新的字符串
var str = "Hello, world!";
var pattern = /o/g;
var replacement = "a";
var result = str.replace(pattern, replacement);
console.log(result); // 输出:Hella, warld!

(6)flags

  • 返回正则表达式的修饰符标志字符串。
var patternFive = /Hello/gi;
var patternSix = /Hello/g;
console.log(patternFive.flags) // gi
console.log(patternSix.flags) // g

(7)使用正则对象

var dataStr = "Hello World!";
let regPattern = new RegExp(/Hello/g)
console.log(regPattern.test(dataStr))
// true

【4】正则的BUG

let reg = /^[a-zA-Z][A-Za-z0-9]/g
//reg.test("chosen");
console.log(reg.test("chosen"))
// 输出结果
true

(1)全局模式的指针移动

let reg = /^[a-zA-Z][A-Za-z0-9]/g// 第一次匹配成功 -- 有数据-- 指针移动到尾端
// reg.test("chosen");
console.log(reg.test("chosen"))
// true// 第二次匹配失败 -- 指针在尾端向后匹配 --无数据
// reg.test("chosen");
console.log(reg.test("chosen"))
// false// 第三次匹配成功 -- 有数据-- 指针回到头部
// reg.test("chosen");
console.log(reg.test("chosen"))
// true// 第四次匹配失败 -- 指针在尾端向后匹配 --无数据
//reg.test("chosen");
console.log(reg.test("chosen"))
// false// 第二次匹配失败 -- 指针在尾端向后匹配 --无数据
console.log(reg.lastIndex)
// 0
console.log(reg.test("chosen"))
// true// 第三次匹配成功 -- 有数据-- 指针回到头部
console.log(reg.lastIndex)
// 2
console.log(reg.test("chosen"))
// false

【九】Math对象

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)      返回角的正切。console.log(Math.exp(2)) // 7.38905609893065
console.log(Math.cos(0.5)) // 0.8775825618903728

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈,一经查实,立即删除!

相关文章

BOM和DOM介绍、Window对象、Window子对象

【一】BOM和DOM介绍 【1】什么是DOM/BOM文档对象模型(Document Object Model, 简称 DOM) 浏览器对象模型(Browser Object Model, 简称 BOM) 是 JavaScript 与网页内容及浏览器环境进行交互的两种核心概念。【2】DOM (1)概述文档对象模型(DOM)是一个编程接口,它以树状结…

Node.js 下载安装与环境配置

下载Node.js ,网址:https://nodejs.p2hp.com/登录node网址,点击下载安装 2.双击node安装包,在弹出界面点击“Next”勾选同意,点击“Next”4.点击”Change“,修改安装目录,点击“Next”使用默认选项,点击下一步“Next”勾选自动安装工具,点击下一步“Next”7.点击“Inst…

kafka集群升级新策略,Cloudera运维专家来揭秘:助你轻松应对大数据挑战

深入探讨了解Cloudera大数据技术的内存扩容、缩容策略,详尽解析了故障诊断与问题排查的方法论,更不乏数据迁移的实战技巧与最佳实践。想了解更多关于大数据技术的内存扩容、缩容策略,详尽解析了故障诊断与问题排查的方法论的问题,可以找我:15928721005项目背景 我们团队负…

IDEA语言切换(设置中文)

1.下载中文语言包2.切换语言

什么是Streamlit

最近,我在数据分析的一些任务中尝试了闻名已久的Streamlit,再一次感受到Python的强大之处。 于是,准备根据自己的掌握情况,写一个介绍Streamlit的系列。 本文作为第一篇, 先介绍介绍Streamlit是什么,以及它和Jupyter和传统Web应用的区别。 1. 是什么 Streamlit是一个用于…

zotero华为平板与pc端同步设置

上课的时候电脑不方便带,听课又太无聊,想着用平板看看论文,就想着多端同步了。 zotero的设置如图, 首先要申请坚果云,作为储存论文的云空间,在zotero里的用户名就是坚果云的账号,不是用户名,要记住! 在坚果云这里添加应用,如图,然后就会生成应用密码,将账号和应用…

SaaS架构:多租户系统架构设计

什么是多租户? 多租户是SaaS领域的特有产物,在SaaS服务中,租户是指使用SaaS系统的客户,租户不同于用户,例如,B端SaaS产品,用户可能是某个组织下的员工,但整个企业组织是SaaS系统的租户。 多租户技术是一种软件架构技术,可以实现多个租户共享系统实例,并且租户间能够实…