0%

The book does contain a lot of his own “biases,” but I find him authentic and humorous. His language is simple and understandable, and each subtitle essentially tells us what we should do.

Understanding Life

Life is never about what you want it to be. It’s good to discover beauty and to view things from others’ perspectives. At the same time, one should have self-awareness.

Understanding Love

Sheldon once said: “The pursuit of another human to spend life with is something I’ve never understood. Maybe I’m too interesting to need company. So I wish you the same joy with each other as I have with myself.”
One can never escape loneliness through another person; only through passion for life. Managing a relationship requires rationality. Freedom is inalienable. I once checked my ex’s phone—I realized it was wrong and won’t do it again.

Understanding Strategy

This section mainly introduces the strategies of courting and how to maintain a good relationship—true wisdom. Never sacrifice your career for family. Don’t live with in-laws (though I think it depends). Have your own hobbies.

Understanding Marriage

Endure and stay loyal. As for non-marriage beliefs, there’s nothing more to say.

Understanding Setbacks

Every breakup is just making way for true love. Don’t force it. I love you, so I wish you well, even if I’m not the one by your side.
Do what you want regardless of others’ opinions. Only care about those who matter to you.

Understanding Reading

What, Why, How. Keep reading. Don’t chase speed, but depth.

Understanding Romance

He shares sweet daily stories with his wife. If you don’t break up, you won’t discover how many better people there are out there. If you find one—lucky. If not—you can still live happily on your own.
Live with emotional intelligence and the world becomes beautiful.

Understanding Socializing

Associate with decent people. Different people require different approaches. Rejecting others is an art. If you don’t have the guts to ask for your money back, don’t lend it.

Understanding Human Nature

I tend to be skeptical about human nature. You can’t control others, so just manage yourself. Don’t be vulgar.

Understanding Good and Evil

Some people enter your life just to teach you a lesson. Good or evil—I prefer believing in others, as trust is given before it’s earned.
Even if deceived, it’s a lesson learned—don’t fall into the same trap again. But don’t stop trusting altogether; kind people still exist.
God made the right hand a right hand as a reward; same for kind people—kindness is its own reward.
I recall being in a restroom without tissue once. I was going to ask a friend, but a stranger overheard and handed me tissues. Such kindness moved me deeply.
Kindness must come with principles—otherwise it may hurt others or yourself.

Understanding Wealth

The poor stay poor because of narrow thinking. To get rich, don’t just invest in your body—think bigger. See the essence of problems.
Time is limited—how to get rich fast? Find a subject you love, apply it, think broadly, and work in fields closely tied to society.

Understanding Society

Have ambition. Take one step at a time. Build an independent personality. Be accountable for your actions. Learn to transform your ability to feel happiness—then change yourself.

Understanding Life and Death

Death studies include concepts like: No death, no life; face death to live; understand death to be reborn. Interesting and thought-provoking.
Knowing that we will die is what pushes us to live fully. When the time comes, I think I’ll embrace death.

What the world lacks isn’t perfect people, but justice, sincerity, courage, and compassion from the heart. — My biggest takeaway after watching Forever Young today.
We all know cause and effect—but causes and effects come from relationships. Someday, I’ll read Schopenhauer and Nietzsche properly.

Understanding Travel

This part recounts Mr. Zhuomo’s experiences in Tibet. Many dream of going there—maybe because it helps people truly understand life’s struggles.
The US is less disciplined than the UK. Japan has great food culture and says “sorry” a lot—avoiding bothering others.

Understanding Career

First learn to endure hardship. Then understand yourself and your talents. Begin with the end in mind and stay focused.

Understanding Education

Every child is born pure. Without proper education, they won’t become pillars of the nation.

Understanding Entertainment & Freedom

Life has two paths: one for career ambition—keep passion; the other for living warmly—keep humanity.
Open your eyes each day and tell yourself: Oh yeah!

var、let、const 三者的区别?

✅ 作用域

  1. var 定义的变量没有块作用域,可以跨块访问,但不能跨函数访问
  2. let 定义的变量有块作用域,只能在声明的代码块中访问
  3. const 定义的是常量,必须初始化,只能在声明的代码块中访问,且值不可更改

✅ 声明规则

  • 同一个变量名,只能用一种声明方式,否则会报错。

✅ 结合 this 的区别

特性 var / let / const
改变 this 指向 ✅ 可以
第一个参数是 this 要指向的对象 ✅ 是
没传对象或为 undefined/null 默认指向全局 window
参数传递 apply 用数组,call 用参数列表,bind 可多次传参
执行方式 apply/call 立即执行,bind 返回新函数
什么是事件委托?
  • 事件委托,会把一个或者一组元素的事件委托到它的父层或者更外层元素上,真正绑定事件的是外层元素,而不是目标元素
  • 当事件响应到目标元素上时,会通过事件冒泡机制从而触发它的外层元素的绑定事件上,然后在外层元素上去执行函数
防抖跟节流的区别是什么?
  • 防抖:只执行最后一次。事件持续触发,但只有等事件停止触发后 n 秒后才执行函数。
  • 节流:控制执行频率。持续触发,每 n 秒执行一次函数。
Web 前端预防 SQL 注入的方法有哪些?
  1. 参数化查询:使用预处理语句或参数化查询来避免 SQL 注入。
  2. 验证用户输入:验证用户输入的数据,确保其符合预期格式,避免非法字符等。
  3. 转义特殊字符:在使用用户输入的数据构造 SQL 语句时,对特殊字符进行转义,以防止注入。
  4. 限制权限:限制用户的权限,使其不能执行不安全的 SQL 操作。
  5. 白名单验证:白名单验证是指确保用户输入的数据只能是允许的值,避免非法数据的输入。
  6. 审核代码:定期审核代码,以确保代码的安全性,特别是对于数据库连接和查询部分的代码。
http 和 https 的区别
  1. https 协议需要到 ca 申请证书,一般免费证书较少,因而需要一定费用。
  2. http 是超文本传输协议,信息是明文传输,https 则是具有安全性的 ssl 加密传输协议。
  3. http 和 https 使用的是完全不同的连接方式,用的端口也不一样,前者是 80,后者是 443。
  4. http 的连接很简单,是无状态的;HTTPS 协议是由 SSL+HTTP 协议构建的可进行加密传输、身份认证的网络协议,比 http 协议安全。
created跟mounted的区别
  • created发生在mounted之前,此时DOM元素还没完全渲染出来,不过跟后端联调时候的请求可以放在这里,尽早获取到数据返回给变量。
  • mounted这时候已经可以获取页面中的DOM元素了。
说说事件循环机制

🔁 什么是事件循环?

JavaScript 是单线程语言,执行代码时除了依赖调用栈,还依赖任务队列来控制异步代码的执行顺序。

整个执行过程称为 事件循环(Event Loop)

🧠 事件循环的核心概念:

  • 一个线程中只有一个事件循环(主循环)。
  • 可以有多个任务队列,按类型分为:
    • 宏任务(Macro Task)
    • 微任务(Micro Task)

⏱ 执行顺序是怎样的?

执行顺序:

宏任务 ➝ 微任务(清空) ➝ 下一个宏任务 ➝ 微任务(清空)… 依此循环

  1. 执行一个宏任务(如 script 整体代码)
  2. 在当前宏任务中执行所有产生的微任务
  3. 若微任务中又产生新的微任务,继续执行,直到清空微任务队列
  4. 开始下一轮宏任务循环

🧩 宏任务(Macro Task)有哪些?

  • script(整体代码)
  • setTimeout
  • setInterval
  • setImmediate(Node.js)
  • I/O 操作
  • UI 渲染

🧬 微任务(Micro Task)有哪些?

  • process.nextTick(Node.js 专属,优先级更高)
  • Promise.then / catch / finally
  • async / await
  • MutationObserver
说说 css 盒模型

css 中的盒子模型包括 IE 盒子模型和标准的 W3C 盒子模型

在标准的盒子模型中,width 指 content 部分的宽度,box-sizing:content-box(默认为content-box);

在 IE 盒子模型中,width 指的是 content+padding+border,box-sizing:border-box;

Box-sizing:padding-box 宽度包含了左右 padding+width

vue2 和 vue3 的区别
  1. 双向数据绑定原理不同,vue2 使用 Es5 的 API defineProperty()对数据进行劫持, 只能监听某个属性,不能对整个对象监听;vue3 使用 ES6 的 proxy API 对数据代理, 可以监听整个对象和数组
  2. 生命周期不同
    vue2:beforeCreate、created 、beforeMount、mounted、beforeUpdate、updated、
    beforeDestroy、destroyed
    vue3:setup 、onBeforeMount 、 onMounted 、onBeforeUpdate 、onUpdated 、
    onBeforeUnmount、onUnmounted
  3. vue2 必须有根标签,vue3 可以没有根标签,会默认将多个根标签包裹在 fragment虚拟标签中
  4. vue2 采用选项式 API,将函数和数据统一起来处理,将功能点切割了,当逻辑复杂时不利于代码阅读;vue3 采用组合式 API,将同一个功能的代码统一起来处理,使代码更有序,有利于代码的书写和维护
  5. vue2 和 vue3 匿名插槽不一样
    具名插槽使用方式不同:vue2 使用 slot=’’,vue3 使用 v-slot:’’
    作用域插槽使用方式不同:vue2 中在父组件中使用 slot-scope=”data”从子组件获取数据,vue3 中在父组件中使用 #data 或者 #default=”{data}”获取

推荐

使用 Docker 安装 ELK Stack(ElasticSearch、Logstash、Kibana)

建议在 Docker 上安装,资源占用少。以下安装版本统一为 8.12.2,建议保持一致避免冲突。

目录

1、安装 ElasticSearch
2、安装 Logstash
3、安装 Kibana
推荐


1、安装 ElasticSearch

  • 拉取镜像:
1
docker pull elasticsearch:8.12.2
  • 启动容器:
1
docker run --name some-elasticsearch -p 9200:9200 -p 9300:9300 -e "discovery.type=single-node" -d elasticsearch:8.12.2
  • 进入容器内部:
1
sudo docker exec -u 0 -it some-elasticsearch bash
  • 重启容器:
1
docker restart some-elasticsearch

2、安装 Logstash

  • 拉取镜像:
1
docker pull docker.elastic.co/logstash/logstash:8.12.2
  • 启动容器:
1
sudo docker run -it -p 5044:5044 -p 9600:9600 --name logstash -v /usr/share/logstash/piplines:/usr/share/logstash/config --privileged=true docker.elastic.co/logstash/logstash:8.12.2 /bin/bash
  • 使用 scp 命令将本机下载好的 jar 包(MySQL Connector)上传至虚拟机:
1
scp "/Users/Downloads/logstash-8.12.2/mysql-connector-j-8.4.0.jar" 用户名@虚拟机IP:/home
  • 再将 jar 包从虚拟机移动到 logstash 容器中:
1
docker cp ./mysql-connector-j-8.4.0.jar logstash:/usr/share/logstash
  • 进入容器内部:
1
docker exec -u 0 -it logstash bash

3、安装 Kibana

  • 拉取镜像:
1
docker pull kibana:8.12.2
  • 启动容器:
1
docker run --name some-kibana -p 9200:9200 -p 9300:9300 -e "discovery.type=single-node" -d elasticsearch:8.12.2
  • 进入容器:
1
docker exec -u 0 -it some-kibana bash

附:安装 Docker、Portainer 及相关命令

1
2
3
4
5
6
7
8
9
10
11
12
sudo apt update
sudo apt install docker.io docker-compose
docker -v
sudo systemctl start docker

sudo docker search portainer
docker pull portainer/portainer
sudo docker pull portainer/portainer
sudo docker run -d --name portainerUI -p 9000:9000 -v /var/run/docker.sock:/var/run/docker.sock portainer/portainer

sudo docker start portainerUI
sudo passwd root

推荐

前端项目 GitLab CI/CD 持续集成部署指南(Mac 环境)

概要

在日常开发过程中,我们经常需要将打包后的 dist 包手动发送给后端部署,效率低且容易出错。CI(Continuous Integration,持续集成)可以自动化这一过程,本文将介绍如何通过 GitLab CI 实现持续集成部署。


一、安装 GitLab Runner

请参考官方文档:GitLab Runner 安装指南


二、本地注册 Runner

  1. 打开你的 GitLab 项目页面,进入 Settings → CI/CD,展开 Runners 部分。
  2. 记住显示的 URLtoken,用于后续注册。

执行注册命令

1
gitlab-runner register

按照提示依次输入以下信息:

  • GitLab CI Coordinator URL: https://gitlab.com
  • GitLab CI Token: xxx(从项目中复制)
  • Tags: my-tag,another-tag(自定义)
  • Description: my-runner(自定义)
  • Executor: shell(Mac 上建议选择 shell)

注册完成后,回到 GitLab CI/CD 设置页面,可看到 Runner 状态为绿色,说明已成功运行。如果不是绿色,请执行以下命令启动 Runner 服务:

1
gitlab-runner run

三、编写 .gitlab-ci.yml 文件并提交

将以下内容保存为 .gitlab-ci.yml,并 push 到 GitLab:

1
2
3
4
5
6
7
8
9
10
11
stages:
- deploy

deploy_to_test:
stage: deploy
script:
- yarn
- rm -rf dist/
- yarn build
- ls -l -t ./dist/
- rsync -avz ./dist/ root@xxx.xx.xx.xxx:/dist
  • 这段 CI 脚本会自动打包项目,并使用 rsyncdist 目录部署到远程服务器。

四、通过 Docker 实现 CI(可选)

如果需要通过 Docker 实现更完整的 CI/CD 流程,继续以下步骤:

1. 安装 Docker(Mac)

1
brew install --cask docker

2. 拉取 GitLab 镜像

1
docker pull drud/gitlab-ce:v0.29.1

3. 创建 GitLab 容器

1
docker run -d -p 8443:443 -p 8090:80 -p 8022:22 --restart always --name gitlab drud/gitlab-ce:v0.29.1

说明:

  • -p 8443:443:映射 HTTPS 端口
  • -p 8090:80:映射 HTTP 端口
  • -p 8022:22:映射 SSH 端口
  • --restart always:容器崩溃或主机重启时自动恢复
  • --name gitlab:容器命名为 gitlab

访问地址:

1
http://localhost:8090/

五、Docker 模式下的 .gitlab-ci.yml 示例

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
variables:
TEST_NAME: "tips"
OUT_PORT: "8081"
IN_PORT: "8081"

stages:
- deploy

deploy_to_test:
stage: deploy
before_script:
- if [ $(docker ps -aq --filter name=$CI_PROJECT_NAME) ]; then docker rm -f $CI_PROJECT_NAME; fi
script:
- docker build -f Dockerfile -t $TEST_NAME:latest .
- docker run -d -p $OUT_PORT:$IN_PORT --name $TEST_NAME $TEST_NAME:latest

部署成功后,在 GitLab 的 CI/CD Pipelines 页面可看到构建过程,在 Containers 页面会生成新容器,点击对应端口即可访问部署后的页面。


推荐

This is an English post.