JavaScript(JS)学习笔记 2(函数 作用域 预解析 对象 内置对象 简单数据类型和复杂数据类型)

文章目录

    • JavaScript中的函数
    • JavaScript中的作用域
    • JavaScript中的预解析
    • JavaScript中的对象
    • JavaScript中的内置对象
    • JavaScript中的简单/复杂数据类型

JavaScript中的函数

函数的声明语法

  • 命名函数声明function 函数名(参数列表) {函数体}。参数列表中的形参并不需要指定数据类型。
  • 匿名函数声明var 变量名 = function(参数列表) {函数体}

函数的实参和形参个数不匹配

  • 实参个数多于形参个数:多出来的实参并不会参与函数的运算。
  • 实参个数小于形参个数:没有赋值的形参将会变成undefined

arguments的使用

  • 当不确定需要给函数传入多少个参数时,可以使用arguments来获取。arguments实际上时当前函数的一个内置伪数组对象,存储了传递给函数的所有实参。
  • 伪数组是指一种具有部分数组特点的对象。它具有和数组一样的length属性,可以通过索引访问元素,但是没有真正数组的一些方法。

JavaScript中的作用域

全局作用域和局部作用域:全局作用域是指整个JS源代码文件都有效,局部作用域是指在某个函数内有效。对应这两个作用域的分别是全局变量和局部变量,和其他编程语言中的概念相同。

  • 另外一种全局变量:在函数内部未声明就直接赋值的变量也属于全局变量。
  • 没有块作用域:JS中没有块作用域,也就是在一对花括号中的作用域。

JavaScript中的预解析

  • JavaScript代码是由浏览器中的JavaScript解析器来执行的,它在运行JS代码时分为预解析和代码执行两部分。
  • 预解析可以分为变量预解析和函数预解析两部分。
  • 在预解析部分,JS引擎会把JS代码中所有的变量和函数声明(不包括变量的初始化)提升到当前作用域的最前面;接下来,才会按照剩余代码的书写顺序从上往下依次执行。

JavaScript中的对象

创建一个对象

  • 使用字面量创建一个对象:使用一对花括号创建一个对象即可,具体语法为:var 对象名 = {属性1: 属性值1, 属性2: 属性值2......方法名: function(参数列表) {函数体}......}
  • 使用new关键字创建一个对象new Object()。这行代码创建了一个空的对象。然后,可以通过对象名.属性名对象名.方法名的方式为该对象添加属性和方法。
  • 利用构造函数创建一个对象
    • 声明一个构造函数function 构造函数名(参数列表) {函数体},函数体中可以使用this.属性名 = 属性值this.方法名 = function 方法名(参数列表) {函数体}的方式来初始化对象的属性和声明对象的方法。
      • 注意事项1:构造函数名的首字母要大写。
      • 注意事项2:构造函数中不能使用return关键字。
      • new关键字的执行过程new关键字被使用时,首先会在内存中创建一个空的对象,然后this就会指向该空对象,接下来就会执行构造函数中的代码,给这个空对象添加属性和方法,最后返回这个对象。
    • 调用一个构造函数var 变量名 = new 构造函数名(参数列表);

使用对象

  • 调用对象的属性:一种语法是对象名.属性名,另外一种语法是对象名[属性名](类似于字典的使用方法)。
  • 调用对象的方法:语法只有一种:对象名.方法名(参数列表)

遍历对象:使用扩展的for循环可以便利对象中的属性名,语法为:for(var 循环变量名 in 对象名)。对象的属性名也就是字典中的键,可以使用该键来获取该属性名对应的属性值。

JavaScript中的内置对象

JS中的对象分类:JS中的对象可以分为自定义对象、内置对象和浏览器对象三大类。前两种属于JS的基础内容,即包含在ECMAScript中,浏览器对象是JS中特有的,将会在后面进行讲解。

内置对象的概念:JS中自带的一些可供开发者使用的对象,提供了一些常用或基本的属性和方法。

Math对象的基本操作

  • Math.PI:表示圆周率。
  • Math.max()/min():求一组数据中的最大值或最小值。如果没有传入参数则会分别返回Infinity-Infinity
  • Math.floor()和Math.ceil():分别表示向下取整和向上取整。
  • Math.round():表示四舍五入就近取整。
  • Math.abs():用于求数字的绝对值。
  • Math.random():获取一个0到1之间的随机浮点数(不包括1)。基于该函数可以生成一个指定区间内的随机整数。

Date对象的基本操作

  • 创建一个Date对象var 对象名 = new Date()。可以通过Console.log输出该对象,输出的内容是当前的时间。
    • 指定对象的时间:可以在创建Date对象时传入参数字符串,例如"2024-9-19"或"2024/10/19"。
  • 获取Date对象的各个部分:可以分别使用getFullYear()getMonth()getDate()getDay()getHours()getMinutes()getSeconds()方法获取当前Date对象的年份、月份(0-11)、日期、星期(0-6)、小时、分钟和秒钟。
  • 获取时间戳:对于支持H5的浏览器,可以使用Date对象的now()方法获取时间戳,即1970年1月1日零点到现在的总毫秒数。

Array对象的基本操作

  • 创建数组:使用语句 var 数组名 = new Array() 可以创建一个空数组,如果传入一个整数作为参数,表示创建一个具有指定个空元素的空数组。
  • 检测一个变量是否为数组
    • 使用instanceof运算符:使用语法为 变量名 instanceof 数据类型,可以用于检测某个变量是否属于某种数据类型,返回值是布尔类型。
    • 使用Array.isArray函数:使用语法为 Array.isArray(变量名),返回值也是一个布尔值。这个方法是H5新增的方法,只有IE9以上版本的浏览器才能支持。
  • 向数组中添加元素
    • 从数组的末尾添加数组名.push(元素1, 元素2....)。该方法会返回新数组的长度。
    • 从数组的开头添加数组名.unshift(元素1, 元素2....)。该方法也会返回新数组的长度。
  • 删除数组中的元素
    • 删除末尾元素数组名.pop()。该函数返回被删除的元素。
    • 删除首个元素数组名.shift()。该函数也返回被删除的元素。
  • 翻转数组中的元素数组名.reverse()
  • 数组元素排序数组名.sort()。该函数中可以传入一个函数的定义,用于指定排序方式。例如,传入function(a,b) { return a - b;} 即表示升序排列。
  • 获取指定元素的索引
    • 从前往后查找第一个数组名.indexOf(数组元素)。如果元素不存在则返回-1
    • 从后往前查找第一个数组名.lastIndexOf(数组元素)。如果元素不存在也是返回-1
  • 将数组转换为字符串
    • 使用toString()方法数组名.toString()。该方法可以将数组中的元素用逗号分隔,然后作为一个字符串返回。
    • 使用join方法数组名.join(分隔符)。该方法可以指定分隔符,而不是像toString方法那样只能使用固定的分隔符。
  • 数组的连接:可以使用数组的concat方法来将两个或多个数组连接成为一个数组。
  • 数组的截取:可以使用数组的slice方法对数组中的部分内容进行截取。

字符串数据类型

  • 基本包装数据类型的概念:JS中会自动将一些简单的数据类型包装成为复杂的数据类型,这样就让基本数据类型有了属性和方法,使得这些数据类型更加便于操作。JS中对StringNumberBoolean三种简单数据类型进行了包装。
  • 字符串的不可变性:任何一个地址存储的字符串的值都不可变,每次对字符串变量的值进行修改,实际是在内存中开辟了一个新的空间存放新的字符串值。因此,在JS中最好不要对同一个字符串变量进行多次赋值,这样会占用大量内存空间。
  • 字符串的常用操作
    • 查找指定字符的位置:可以通过字符串对象的indexOf()函数求一个字符在字符串中出现的首个位置,如果没有找到则返回-1。 该函数可以传入两个参数,分别是需要查找的字符和开始查找的位置索引。另外,还可以通过lastIndexOf()函数进行反向查找。
    • 获取指定位置的字符
      • 可以通过charAt()方法获取字符串中指定位置的字符,传入的参数是位置索引。在HTML5中,可以使用和Python一样的字符串索引来获取字符串中指定位置的字符。
      • 可以通过charCodeAt()方法获取字符串中指定位置字符对应的ASCII码值。
    • 连接多个字符串:可以通过concat(str1, str2, str3...)函数来连接多个字符串。 但是,一种更常用的方式是通过 + 运算符来连接多个字符串。
    • 获取一个字符串的子串:可以通过字符串的substr()方法获取一个字符串的子串。该函数的输入参数分别是子串的起始位置和子串的长度。
    • 替换字符串中的部分子串:可以通过字符串的replace()方法来替换字符串中的部分子串。该函数的输入参数分别是被替换的字符和替换的字符。但是,该字符串只是对从前往后满足条件的第一个字符进行替换,在后面学习了正则表达式之后我们会有更好的方法来替换子串。
    • 将字符串转换为数组:可以通过字符串的split(分隔符)方法获取一个数组,该数组中的每个元素是原始字符串中被分隔符分开的多个部分。

JavaScript中的简单/复杂数据类型

  • 变量存储内容不同:简单数据类型(基本数据类型)在存储时变量中存储的是值本身,因此也被称为值类型;复杂数据类型在存储时变量中仅仅存储地址,因此也被称为引用数据类型。
  • 内存存放位置不同:简单数据类型存储在栈上,复杂数据类型存储在堆中。如果将复杂数据类型的变量作为参数传递给函数,在函数中对其进行了修改,则函数外该变量的值也会发生变化。

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

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

相关文章

机器学习之非监督学习(四)K-means 聚类算法

机器学习之非监督学习(一)K-means 聚类算法 0. 文章传送1.非监督学习定义2.非监督学习分类2.1 聚类 Clustering2.2 异常检测 Anomaly Detection 3.K-means聚类算法 K-means clustering案例引入算法步骤算法优化成本函数初始化方法K的选择 代码实现 4.案例…

ElementUI 布局——行与列的灵活运用

ElementUI 布局——行与列的灵活运用 一 . 使用 Layout 组件1.1 注册路由1.2 使用 Layout 组件 二 . 行属性2.1 栅格的间隔2.2 自定义元素标签 三 . 列属性3.1 列的偏移3.2 列的移动 在现代网页设计中&#xff0c;布局是构建用户界面的基石。Element UI 框架通过其强大的 <e…

learn C++ NO.17——继承

什么是继承&#xff1f; 用冒号 : 后跟基类名称来声明一个类是从某个基类继承而来的。继承方式可以是 public、protected 或 private&#xff0c;这决定了基类成员在子类中的访问权限。 下面通过代码简单进行一下演示. 派生类Student即子类&#xff0c;而基类Person是它的父…

Ubuntu22.04安装paddle

查看系统版本信息 使用命令lsb_release -a查看系统版本 rootLAIS01:~# lsb_release -a No LSB modules are available. Distributor ID: Ubuntu Description: Ubuntu 22.04.5 LTS Release: 22.04 Codename: jammy查看系统支持的cuda版本&#xff0c;使用命令nvidia-smi&#…

基于paddleocr的批量图片缩放识别

说明 在进行ocr文字识别的时候&#xff0c;有时候我们需要使用批量测试的功能&#xff0c;但是有些图片会识别失败或者个别根本识别不出来&#xff0c;这时候我们可以通过对原图片进行缩放&#xff0c;提高图像的分辨率&#xff0c;然后再次识别&#xff0c;这样可以大大提高图…

Canal+RabbitMQ数据同步环境配置

Canal 是阿里巴巴开发的开源工具&#xff0c;主要用于解析 MySQL 的 binlog 日志&#xff0c;从而实现数据同步。Canal 会模拟 MySQL 从库的协议&#xff0c;订阅主库的 binlog&#xff0c;从而获取数据库的变更信息。 将 Canal 解析到的 MySQL 数据库变更消息通过 RabbitMQ 分…

青柠视频云——视频丢包(卡顿、花屏、绿屏)排查

一、问题说明 近期有客户反馈&#xff0c;接入平台的设备经常出来卡顿、花屏、录屏的情况&#xff0c;出现这样的场景很是尴尬。 客户是私有化部署在公网环境&#xff0c;于是我们联系客户&#xff0c;对问题进行追踪排查。 二、场景复现 我们现场情况确认的过程中&#xff0c;…

蓝桥杯嵌入式客观题合集

十四届模拟赛二客观题 解析&#xff1a;STM32微控制器的I/O端口寄存器必须按32位字被访问 解析&#xff1a;微分电路能将三角波转换为方波&#xff1b;积分电路能将方波转换为三角波 解析&#xff1a;放大电路的本质是能量的控制与转换 解析&#xff1a;具有n个节点&#xff0c…

修改Docker默认存储路径,解决系统盘占用90%+问题(修改docker root dir)

随着Docker技术的广泛应用&#xff0c;它极大地简化了复杂项目的部署与维护流程&#xff0c;仅凭单一镜像即可轻松运行。然而&#xff0c;随着数据量不断增长&#xff0c;Docker的默认数据存储方式可能逐渐成为挑战&#xff0c;尤其是当默认安装于根目录&#xff08;“/”&…

【雪球-注册安全分析报告-无验证方式导致安全隐患】

前言 由于网站注册入口容易被黑客攻击&#xff0c;存在如下安全问题&#xff1a; 1. 暴力破解密码&#xff0c;造成用户信息泄露 2. 短信盗刷的安全问题&#xff0c;影响业务及导致用户投诉 3. 带来经济损失&#xff0c;尤其是后付费客户&#xff0c;风险巨大&#xff0c;造…

Python酷库之旅-第三方库Pandas(104)

目录 一、用法精讲 451、pandas.DataFrame.pow方法 451-1、语法 451-2、参数 451-3、功能 451-4、返回值 451-5、说明 451-6、用法 451-6-1、数据准备 451-6-2、代码示例 451-6-3、结果输出 452、pandas.DataFrame.dot方法 452-1、语法 452-2、参数 452-3、功能…

【C++】STL简介

&#x1f525;个人主页&#xff1a; Forcible Bug Maker &#x1f525;专栏&#xff1a;STL || C 目录 前言什么是STL&#xff1f;STL的历史STL的版本STL六大组件STL的优缺点STL的优点&#xff1a;STL的缺点&#xff1a; 如何学习STL结语 前言 本篇博客主要内容&#xff1a;ST…

灾备技术演进之路 | 虚拟化无代理备份只能挂载验证和容灾吗?只能无代理恢复吗?且看科力锐升级方案

灾备技术演进之路系列 虚拟化备份技术演进 摆脱束缚&#xff0c;加速前行 无代理备份仅能挂载/恢复验证吗&#xff1f; ——科力锐极简验证演练无代理备份来了 无代理备份无法应对平台级故障吗&#xff1f; ——科力锐应急接管无代理备份来了 无代理备份仅能同平台挂载吗&a…

Llama 3.1 Omni:颠覆性的文本与语音双输出模型

你可能听说过不少关于语言模型的进展,但如果告诉你,有一种模型不仅能生成文本,还能同时生成语音,你会不会觉得特别酷?今天咱们就来聊聊一个相当前沿的项目——Llama 3.1 Omni模型。这个模型打破了传统的文字生成边界,直接让文本和语音同时输出,实现了真正的"多模态…

无人机之AI跟踪篇

无人机的AI识别技术依托于计算机视觉和深度学习技术&#xff0c;实现了对目标的快速精准识别&#xff0c;在多个领域展现出了巨大的应用潜力和价值。以下是对无人机AI识别技术的详细解析&#xff1a; 一、无人机AI识别算法的基础原理 无人机AI识别算法主要基于先进的计算机视觉…

轻松解决Jetpack Compose中的一些痛点问题

公众号「稀有猿诉」 原文链接 轻松解决Jetpack Compose中的一些痛点问题 暑去秋来&#xff0c;金桂飘香&#xff0c;不知不觉中我们已经练完了『降Compose十八掌』&#xff0c;相信通过这一系列文章能够对Jetpack Compose有足够的理解&#xff0c;并能在实际项目中进行运…

Linux memcg lru lock提升锁性能

目录 内核关于per memcg lru lock的重要提交&#xff1a; 计算虚拟地址转换基本机制 问题背景 swap换入流程 时奎亮的per memcg lru lock分享视频 内核关于per memcg lru lock的重要提交&#xff1a; f9b1038ebccad354256cf84749cbc321b5347497 6168d0da2b479ce25a4647d…

感知笔记:ROS 视觉- 跟随红球

- 目录 - 如何在 ROS 中可视化 RGB 相机。如何作为机器人切换主题。如何创建 blob 检测器。如何获取要跟踪的颜色的颜色编码。如何使用 blob 检测数据并移动 RGB 相机以跟踪 blob。 机器人技术中最常见的传感器是不起眼的 RGB 摄像头。它用于从基本颜色跟踪&#xff08;blob 跟…

ssm自助购药小程序 LW PPT源码调试讲解

第二章开发技术介绍 此系统的关键技术和架构&#xff0c;Java技术、B/S结构、Ssm框架和Mysql数据库&#xff0c;是本系统的关键开发技术&#xff0c;对系统的整体、数据库、功能模块、系统页面以及系统程序等设计进行了详细的研究与规划。 2.1 系统开发平台 在线自助购药小程…

PMP--二模--解题--1-10

文章目录 4.整合管理--商业文件--商业论证&#xff08;是否值得所需投资、高管们决策的依据&#xff09;反映了&#xff1a;1、 [单选] 收到新项目的客户请求之后&#xff0c;项目经理首先应该做什么&#xff1f; 14.敏捷--角色--产品负责人PO–职责–1.创建待办列表并排序;2.确…