华清远见重庆中心——JS技术个人总结

一、JavaScript的几种数据类型

1、number 数字类型，2、Boolean 布尔类型，3、string 字符串类型，4、BigInt 长整型，5、null 空指针，6、undefined 未定义，7、symbol 符号类型，8、object 对象。

二、数据类型的转换

            不同的数据类型之间是可以相互转换的，数据转换的方法分为显示转换、隐式转换两种方法，例如下面的几种显示转换：

1、布尔类型转化成数字、字符串

var bool = true;
// 将布尔类型转换成数字类型,true表示为1、false表示为0
bool = Number(bool);
console.log(bool) // bool = 1
// 将布尔类型转换成字符串类型
bool = false;
bool = String(bool);
console.log(bool) // bool = 'false'

2、数字类型转换成布尔、字符串

var num = 123;
// 转换成布尔值，num不是0时就是true，是0时才会是false
num = Boolean(num);
console.log(num); // num = 1
// 转化成字符串
num = 123;
num = String(num);
console.log(num) // num = '123'

3、字符串转换成数字、布尔值

var str = "Hello World";
// 转换成数字
var num = Number(str);
console.log(num); // num = NaN，NaN表示非数字，是数字类型的一种表示
str = "123";
num = Number(str); // num = 123
// 转换成布尔值
var bool = Boolean(str);
console.log(bool); // bool = true,当字符串长度等于0时为false

三、var、let、const三者的区别

        1、在同一作用域下var可以重复声明变量，let和const不能重复声明变量。

        2、var具备变量提升，let和const不具备变量提升。

        3、var和let声明变量可以不赋初始值，const声明变量必须赋初始值。

        4、var和let声明的变量可以改变初始值，const不能改变初始值。

四、字符串的常见操作方法

var str = 'hello world';
// 查看字符串的长度
var len = str.length;


// split: 分割字符串
// 参数：用于分割字符串的字符
// 返回值：字符串数组
var r = str.split();

// trim: 去掉字符串首尾空格
str = ' hello world '
str = str.trim();

// substring: 截取子字符串
// 第一个参数：截取字符串的起始索引位置
// 第二个参数：截取字符串的结束索引位置
r = str.splice(2,6);

// startsWith: 用于判断字符串是否以指定字符串开头
// 参数：指定开头的字符串
// 返回值：bool值，true代表是以指定字符串开头的，false代表不是
r = str.startsWWith('h');

// endsWith: 用于判断字符串是否以指定字符串结尾
r = str.endsWith('d');

// toUpperCase toLowerCase 将字符串中的英文转成全为大写或小写
str = str.toUpperCase();
str = str.toLowerCase();

五、数组去重的方法

let arr = [,1,0,3,2,1,4,5,6,3,2,5,4];
// 1、缓存重复数据

// 使用 filter 去重
let temp = {}
let result = []
result = arr.filter(el => {
 // 若缓存中没有el
  if (!temp[el]) {
    // 加入缓存
    temp[el] = true
    return true
  }
    return false
})
console.log(result);


// 2. 使用 set 集

// 构造set对象，set对象会自动去重
let set = new Set(arr)
// 将set转换为数组
result = Array.from(set)
console.log(result);

六、防抖

// 函数将在一个固定时间后被调用，
// 若计时未完成又执行该函数，则取消上次计时，重新开始计时

// 防抖
const fd = (() => {
  // 计时器id
  let timerId;
  return () => {
    // 取消计时
    clearTimeout(timerId);
    // 重新计时
    timerId = setTimeout(() => {
      console.log('hello world');
    }, 3000);
  }
})() 

七、节流

// 固定时间内只能调用一次的函数，可以使用时间戳或计时器
  // 计时器
  function jlTime() {
    let timer;
    // 1、判断是否可以运行
    let cd = 3000;
    return () => {
      if (timer) return
      console.log('节流2');
      // 开始计时
      timer = setTimeout(() => {
        timer = undefined;
      }, cd)
    }
  }