JavaScript 算法每日一题：加一

家好，很高兴又见面了，我是姜茶的编程笔记，我们一起学习前端相关领域技术，共同进步，也欢迎大家关注、点赞、收藏、转发，您的支持是我不断创作的动力

铁子们！从 2024/07/26 开始，我们进入算法专题篇的学习啦。学习计划如下：
1?? 每日一题;
2?? 学习顺序是由易到难；
3?? 题目按照数据结构进行分类;
4?? 每个类型的题目预计安排 100 道题（简单/中等/困难各 33 道）;

题目描述

给定一个由整数组成的非空数组所表示的非负整数，在该数的基础上加一。

最高位数字存放在数组的首位，数组中每个元素只存储单个数字。

你可以假设除了整数 0 之外，这个整数不会以零开头。

示例 1：

输入：digits=[1,2,3]
> 输出：[1,2,4]
> 解释：输入数组表示数字 123。

示例 2：

输入：digits=[4,3,2,1]
> 输出：[4,3,2,2]
> 解释：输入数组表示数字 4321。

示例 3：

输入：digits=[0]
> 输出：[1]

提示：

1 <=digits.length <=100
0 <=digits[i] <=9

分析/求解

要解决这个问题，我们可以从数组尾部开始往前扫，逐位进位即可。最高位如果还有进位需要在数组里面第 0 位再插入一个 1 。以下是详细的解释和多种解决方法：

方法一：遍历加法

通过从数组的末尾开始，逐位处理进位问题，直到处理完所有需要进位的情况。

时间复杂度：O(n)，其中 n 是数组的长度。我们需要遍历数组中的每个元素。
空间复杂度：O(1)，只使用了常数级别的额外空间。

var plusOne=function (digits) {
    for (let i=digits.length - 1; i >=0; i--) {
        if (digits[i] < 9) {
            digits[i]++;
            return digits;
        }
        digits[i]=0;
    }
    digits.unshift(1);
    return digits;
}

方法二：递归法

使用递归方法处理每一位上的加法和进位问题。这种方法在实际应用中不如方法一高效，但它展示了不同的思维方式。

时间复杂度：O(n)，其中 n 是数组的长度。每次递归调用处理一个元素。
空间复杂度：O(n)，递归调用栈的深度为 n。

var plusOne=function (digits) {
    function helper(index) {
        if (index===-1) {
            digits.unshift(1);
            return;
        }
        if (digits[index] < 9) {
            digits[index]++;
            return;
        }
        digits[index]=0;
        helper(index - 1);
    }
    helper(digits.length - 1);
    return digits;
}

总结

在实际应用中，遍历加法是解决这个问题的最佳选择，因为它不仅能在 O(n) 的时间复杂度内高效处理加一操作，而且实现简单易懂。递归方法虽然展示了不同的思维方式，但在性能和实现复杂度上不如遍历加法法优越。

附件：

最后

如果有任何问题或建议，欢迎在评论区留言交流！祝你编程愉快！

.HTML 介绍

是网页的后缀，txt 后缀是文本，py 后缀是 python ，html 后缀就是网页的意思。我们如果想创建一个网页的话，可以直接将文本的后缀改为 html 。HTMLSHI 超文本标记语言，是一种标识性的语言。它包括一系列标记标签，通过这些标记标签可以将网络上的文档格式统一，使分散的Internet资源连接为一个逻辑整体。

1.html 的介绍

页面整体分为两部分：

一部分是head部分，主要是页面的整体信息和配置，内容不会出现在浏览器内部。

一部分是body部分，这部分内容则会在浏览器中展示出来

我们使用 pycharm 创建一个 html ，打开后就是下图模样。

（1）文档类型声明（默认的可以不用设置）

<!DOCTYPE html>

（2）开始标签和结束标签

一般的标签是成对出现的，一般称第一个标签是开始标签，第二个是结束标签。开始和结束标签也称为开放标签和闭合标签。

开始标签：

<html lang="en">

其中的 html 为根元素，是所有元素的基础。lang 表示语言，en 表示英文。

结束标签：

</html>

（3）头部标签

<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>

其中 utf-8 表示字符编码格式，如果没有写这个就会发生乱码。Title 表示文档的标题。

（4）身体标签

<body>

</body>

身体标签是文档的主题，可视化区域，所有的音频，视频，图片，文字都可在其中搭建，相当于我们打开网页时所看到内容。

（5）标签的特点

标签是由一对尖括号包裹单词构成的，标签要使用小写。一般的标签是成对出现的，一般称第一个标签是开始标签，第二个是结束标签。开始和结束标签也称为开放标签和闭合标签。

二.标签

标签分为块级标签和内联标签（运行时点击右上角的谷歌模式的小圆圈就可以）

1.内容的书写

（1）块级标签（p）

两个 p 中间可随意书写内容

<p>故事和酒，淘宝都有</p>

（2）内联标签（span）

<span>故事和酒，淘宝都有</span>

完整代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<!-- 块级标签--> 
<p>故事和酒，淘宝都有</p>
<!--内联标签-->
<span>故事和酒，淘宝都有</span>
</body>
</html>

运行后：

运行后看不出块级标签和内联标签的区别，所有我们使用检查。右击后点击检查

在点击下图中左上角的方框箭头，变成蓝色说明正在运行，之后就可以查看有关的数据了

无需点击，只要将箭头放在文字上就会出现相关内容

上面两图可以明显看出两句话的宽度不相同。

块级标签：在不设置宽度的情况下，宽度始终和浏览器宽度保持一致。

内联标签：宽度和内容有关

2.设置高度宽度

<p style="width: 500px;height: 50px;">故事和酒，淘宝都有</p>

<span style="width: 500px;height: 50px;">故事和酒，淘宝都有</span>

如图所示，只有块级标签宽高改变了，内联标签不改变。由此可得，块级标签设置宽高有效，内联标签设置宽高无效。

3.多个标签同时存在

<body>
<!-- 块级标签-->
<p>故事和酒，淘宝都有</p>
<p>故事和酒，淘宝都有</p>
<!--内联标签-->
<span>故事和酒，淘宝都有22</span>
<span>故事和酒，淘宝都有22</span>
</body>

多个块级标签同时存在的情况下，排列方式从上往下
多个内联标签同时存在的情况下，排列方式从左往右

4.是否包含

<body>
<!-- 块级标签-->
<p>故事和酒，淘宝都有
    <span>故事和酒，淘宝都有22</span>
</p>

<!--内联标签-->
<span>故事和酒，淘宝都有22
    <p>故事和酒，淘宝都有</p>
</span>

</body>

由此可知，块级标签可以包含内联标签，但内联标签不可以包含块级标签，只可以包含内联标签。

5.块级标签与内联标签相互转换

（1）块级转内联

<body>
<!--将块级标签转化成内联标签-->
<p style="display: inline">故事和酒，淘宝都有</p>
<p style="display: inline">故事和酒，淘宝都有</p>

</body>

（2）内联转块级（display: block）

内联转为块级之后，具有了块级的性质。

<span style="display: block">故事和酒，淘宝都有222</span>
<span style="display: block">故事和酒，淘宝都有222</span>

（3）内联块元素（display: inline-block）

内联块元素包含了内联标签和块级标签的部分特性。

<span style="display: inline-block">故事和酒，淘宝都有333</span>
<span style="display: inline-block;height: 50px">故事和酒，淘宝都有333</span>

（4）段落标签（p）

<!--段落标签-->
<p></p>

（5）标题标签（h）

、标签理解

1.HTML标签由尖括号包围关键词。通常是成对出现的，称为双标签。例如<html>(开始标签)和</html>(结束标签)。有些特殊标签为单个标签，称为单标签。例如<br/>

2.标签关系有包含关系和并列关系

3.标签的含义(语义)：标签是用来干嘛的。(在适合的地方给一个合理的标签可以使页面结构更清晰)

4.每个网页都会有一个基本的结构标签(也称为骨架标签)，HTML页面也称为HTML文档

二、基本结构标签

1.<html>标签是根标签，页面中最大的标签

2.<head>标签是文档的头部，在<head>标签内必须设置<title>标签

3.<title>标签是文档的标题，网页的标题

4.<body>标签是文档的主体，文档的所有内容，网页内容

三、常见标签

1.标题标签<h1>-<h6>(head的缩写)

(1) 语义：作为标题使用，并依据重要性递减(2) 特点：a.加了标题标签文字会变粗，字号依次变大 b.一个标题独占一行

2.段落标签<p>(paragraph的缩写)

(1) 语义：可以把HTML文档分割为若干段落

(2) 特点：a.一个段落根据浏览器窗口的大的自动换行 b.段落之间有大的空隙

3.换行标签<br/>(break的缩写)

(1) 语义：强制换行

(2) 特点：a.<br/>是个单标签 b.<br/>只是简单重新开始一行与段落不同

4.文本格式标签(为文字设置粗体,斜体或下划线等效果，语义：突出重要性)

(1) 加粗：<strong></strong>或<b></b> 推荐使用<strong>标签，语义更强烈

(2) 倾斜：<em></em>或<i></i> 推荐使用<em>标签，语义更强烈(emphasize)

(3) 删除线：<del></del>或<s></s> 推荐使用<del>标签，语义更强烈(delete)

(4) 下划线：<ins></ins>或<u></u> 推荐使用<ins>标签，语义更强烈(insert)

5.<div>和<span>标签(没有语义，是一个盒子，用来装内容 division span)

特点：a.<div>标签用来布局，一行只能放一个<div>,是个大盒子 b.<span>标签用来布局，一行可以有多个<span>,是个小盒子

在线咨询

上一篇：了不起的 Unicode
下一篇：5.HTML列表元素

您的项目需求

*请认真填写需求信息，我们会在24小时内与您取得联系。

整合营销服务商