ARTS第二周

发表于

Algorithm

Reverse Integer

question

Given a 32-bit signed integer, reverse digits of an integer.
Example 1:

1
2
Input: 123
Output: 321

Example 2:

1
2
Input: -123
Output: -321

Example 3:

1
2
Input: 120
Output: 21

Note:
Assume we are dealing with an environment which could only store integers within the 32-bit signed integer range: [−231, 231 − 1]. For the purpose of this problem, assume that your function returns 0 when the reversed integer overflows.

answer
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
class Solution(object):
    def reverse(self, x):
        """
        :type x: int
        :rtype: int
        """
        neg = False
        if x<0:
            x = x*-1
            neg = True
        s = str(x)[::-1]
        n = int(s)
        if neg:
            n = n*-1
        if abs(n)>(2**31-1):
            return 0
        return n

Rewiew

https://codeburst.io/software-architecture-the-difference-between-architecture-and-design-7936abdd5830

文章详细描述软件架构和软件设计的区别并说明两种设计常用的模式。软件架构是将软件特性如灵活性、可伸缩性、可行性、可重用性和安全性等转换为符合技术和业务预期的解决方案过程。常用的设计模式有Serverless架构、事件驱动架构、微服务架构。软件设计则是在代码层面设计软件，如模块划分、类的范围和函数功能等。常见的模式有工厂模式、适配器模式。文章详细、清晰对两个概念进行解释。

Tip

近期做项目的过程中再次接触VUE，虽然磕磕绊绊完成前端页面，但是编写代码过程中仍然对基础知识了解不多。项目完成后对编写代码过程中遇到的知识点汇总并仔细研究。除前端外，做项目过程中也接触了flask_cas和Nginx的日志格式，将相关知识点汇总并记录。

VUE
v-if与v-for

v-if可以有条件的渲染一块内容，这块内容只会在指令的表达式返回 truthy 值的时候被渲染。可以使用v-if控制元素的显示。
v-for根据一组数组的选项列表进行渲染。可以方便的展示列表、下拉框机选项等。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
<template>
  <div id="app">
    <!-- <img src="./assets/logo.png"> -->
      <p v-if="seen">现在你看到我了</p>
      <ol>
        <li v-for="(todo,index) of todos" :key="index" >
          {{ todo.text }}
        </li>
      </ol>
  </div>
</template>

<script>
export default {
  name: 'App',
  data () {
    return {
      seen: true,
      todos: [
        {'text': '测试1'},
        {'text': '测试2'},
        {'text': '测试3'},
        {'text': '测试4'},
        {'text': '测试5'}
      ]
    }
  }
}
</script>

<style>
#app {
  font-family: 'Avenir', Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}
</style>

启动后，页面展示为:

prop

Prop是可以在组件上注册一些自定义的特性。当一个值传递给prop特性的时候，它就变成了那个实例组件的一个属性。为了给博文组件传递一个标题，我们可以用一个 props 选项将其包含在该组件可接受的 prop 列表中。对于vue-cli生成的vue项目有，我们在components目录下新建一个vhead.vue的文件，内容如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
 <template>
    <h3>{{ title }}</h3>
</template>
<script>
export default{
  name: 'vheader',
  data () {
    return {
    }
  },
  props: ['title']
}
</script>

在App.vue中注册并使用它

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
 <template>
  <div id="app">
    <!-- <img src="./assets/logo.png"> -->
      <vhead title="测试组件1"></vhead>
      <vhead title="测试组件2"></vhead>
      <vhead title="测试组件3"></vhead>

  </div>
</template>

<script>
import vhead from './components/vhead'
export default {
  name: 'App',
  components: {vhead}
}
</script>

<style>
#app {
  font-family: 'Avenir', Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}
</style>

运行之后效果如图，一个组件默认可以拥有任意数量的 prop，任何值都可以传递给任何 prop。在上述模板中，你会发现我们能够在组件实例中访问这个值，就像访问 data 中的值一样。

watch

虽然计算属性在大多数情况下更合适，但有时也需要一个自定义的侦听器。这就是为什么 Vue 通过 watch 选项提供了一个更通用的方法，来响应数据的变化。当需要在数据变化时执行异步或开销较大的操作时，这个方式是最有用的。

Flask-CAS

Flask-CAS是提供了方便与cas server进行认证的插件。
使用过程中有两个重要配置，CAS_SERVER是CAS服务器的地址，CAS_AFTER_LOGIN是登录成功后跳转的端点。

Nginx日志配置

某项目上线后，发现有时会出现网页loading特别慢的情况，希望通过Nginx日志查看请求各阶段的时间。通过log_format可以配置Nginx日志的打印格式，access_log使用配置的log_format即可。

log_format

log_format设置格式如下

1
2
3
log_format main 'remote_addr=[$remote_addr] http_x_forward=[$http_x_forwarded_for] time=[$time_local] request=[$request] '
    'status=[$status] byte=[$bytes_sent] elapsed=[$request_time] refer=[$http_referer] body=[$request_body] '
    'upstream_response_time=[$upstream_response_time] ';

其中各项定义为:

1
2
3
4
5
6
7
8
9
10
$remote_addr    #记录访问网站的客户端地址
$http_x_forwarded_for    #当前端有代理服务器时，设置web节点记录客户端地址的配置，此参数生效的前提是代理服务器也要进行相关的x_forwarded_for设置
$time_local    #记录访问时间与时区
$request   #用户的http请求起始行信息
$status    #http状态码，记录请求返回的状态码
$bytes_sent   #http状态码，记录请求返回的状态码
$request_time   #整个请求的总时间  
$http_referer  #url跳转来源  
$request_body   #请求报文中body内容
$upstream_response_time   #请求过程中，upstream响应时间

定义好log_format后，access_log或者error_log的配置如下，记录的日志即按照配置的格式记录。

1
access_log  xxxx(path) main;

Share

https://doc.huodongjia.com/detail-3423.html

文章是互联网时代的持续交付，是阿里某专家在ArchSummit上的会议演讲。文中提到了持续交付过程中经常遇到的一些问题以及他们在实施时采用的方法。对公司实施持续交付有一定参考价值。