后端&前端零碎知识点和注意问题

时间 2019-12-05

标签后端前端零碎知识注意问题繁體版

原文原文链接

后端

1. Spring自带的MD5加密工具类html

import org.springframework.util.DigestUtils;

String md5Password = DigestUtils.md5DigestAsHex(password.getBytes());

2. 数据库的字段名不要含有 is前端

好比数据库有个字段为is_valid，那么到代码里这个变量为isValid。若是刚好这个变量是Boolean类型的，那么若是返回数据到前端，那么json串为{"valid":true}，能够看见is被无形去掉了。java

看自动生成的get方法，没有get前缀，都是由于Boolean类型的get方法都是以is开头的，而这样会覆盖掉你名字里的is前缀，因此若是你的变量为Boolean类型命名要避免以is开头。web

3. invalid comparison: org.springframework.web.bind.annotation.RequestMethod and java.lang.Stringspring

别人留下的坑：sql

mybatis里面的sql语句，org.springframework.web.bind.annotation.RequestMethod是个枚举类数据库

<if test="requestMethod!=null and requestMethod!='' ">
    REQUEST_METHOD=#{requestMethod , jdbcType=VARCHAR, typeHandler=org.apache.ibatis.type.EnumTypeHandler},
</if>

这里的判断：requestMethod != ''　致使报错，由于你一个枚举类怎么能跟字符串做比较呢？apache

4. 修改html页面，IDEA不自动部署的问题json

首先禁用掉当前模板引擎的缓存，好比：spring.thymeleaf.cache=false，页面修改以后按Ctrl+F9从新Build Project后端

5. org.springframework.web.servlet.config.annotation.WebMvcConfigurerAdapter 已废弃

自5.0版本开始，MVC相关配置可直接实现 org.springframework.web.servlet.config.annotation.WebMvcConfigurer

import com.example.demo.interceptor.CommonInterceptor;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.InterceptorRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;

@Configuration
public class MyWebConfig implements WebMvcConfigurer {

    @Autowired
    private CommonInterceptor commonInterceptor;

    /**
     * 配置拦截器
     * @param registry
     */
    @Override
    public void addInterceptors(InterceptorRegistry registry) {
        registry.addInterceptor(commonInterceptor).addPathPatterns("/**").excludePathPatterns("/login");
    }
}

6. 查看SpringBoot默认的配置类

在application.properties里面配置debug=true，在启动的时候就会打印开启的默认配置类。

前端

1. string转number

<script>
$(document).ready(function(){
      var p = +$('p').text();
    $('div').text(p+1);
});
</script>
</head>
<body>
    <div></div>
    <p>1</p>
</body>
</html>

输出2而不是11

2. JQuery警告，低效的选择器用法

好比：

$('#resultData :checked');

会警告

Inefficient jQuery usage less... (Ctrl+F1)
Checks that jQuery selectors are used in an efficient way. It suggests to split descendant selectors which are prefaced with ID selector and warns about duplicated selectors which could be cached

应改为：

$('#resultData').find(':checked');

3. Comparison $.trim($(t[9]).val()) == "" may cause unexpected type coercion less...

好比：判断表单内容去除空格后是否为空

$.trim($(t[0]).val()) == ""

会警告

应改成：

$.trim($(t[0]).val()) === ""

4. new Boolean(value) 和 Boolean(value)的区别

前者是做为构造函数构造一个Boolean实例，获得的是一个对象；后者是做为普通函数调用，获得的是函数返回值false/true。

5. Ajax请求，传递的数组参数名称多了一个[]

利用JQuery的$.param(params,true)来解决

var myObject = {
  a: {
    one: 1, 
    two: 2, 
    three: 3
  }, 
  b: [1,2,3]
};
var recursiveEncoded = $.param(myObject);
var recursiveDecoded = decodeURIComponent($.param(myObject));

console.log(recursiveEncoded);
console.log(recursiveDecoded);

var shallowEncoded = $.param(myObject, true);
var shallowDecoded = decodeURIComponent(shallowEncoded);

console.log(shallowEncoded);
console.log(shallowDecoded);

6. Input 文件域重复上传，不触发change事件

<input type="file" id="upload">

  $("#upload").change(function(){
      // 上传或者其它操做
      // ....
      // 最后将value置为空
      $(this).val('');
  });

也能够用一个新的input替代当前的input。