js++知识点--记录 2

88 阅读3分钟

1、 px em rem

px => 相对与屏幕像素,像素越多那么就会约清晰, 如果屏幕从小屏幕到大屏幕 同样的像素,那么大屏幕不一定清晰 对不同屏幕大小 适配的话不一定能够准确的展示,不能解决不同设备上不同分辨率的适配 所以出现了em

em => 根据父级元素设置的px值来,在此基础之上。如果最近的父级上没有设置font-size的字号 ,会一级一级的朝上去找有font-size的值,一直到html的根节点上设置:font-size

<html lang="en" style="font-size: 12px">

缺点:em会有就近原则,如果在最近的父级上设置了font-size,那么就会改变这个父级下的像素,而不会根据html那个节点上的值为依据。因此出现了rem

rem => 解决了em的缺陷,这个就是在根节点上设置值,不会受到父级的设置的值影响。 可以用第三方插件,更加完善的修缮rem

<html lang="en" style="font-size: 12px">

根据375px的设计稿

图片.png

375 / 37.5 = 10px 1.6rem

441 / 37.5 = 11.76px 1.6rem

font-size: 62.5% 不准确,因为是依据浏览器的16px,但是不是每个浏览器的默认大小都是16px;

面试题:['1', '2', '3'].map(parseInt)

解析第一步 拆分:

 var newArr = arr.map(test)
 console.log(newArr)
 function test (value, index, array){
   return value;
 }

解析第二步 parseInt:转整型

图片.png

function parseInt(string){ return string -> 转成int }

但是回传3个值进来,但是parseInt只接收2个值

parseInt('1', 2) => 首先'1'会转整数, => 当成2进制数字 => 转换 => 10进制

['1', '2', '3'].map(function parseInt(value, index) {
 // '1' 0 1的0进制 所以0或者不写 那么就当十进制 那么十进制转十进制 那么就是不转
 // '2' 1 2的1进制 没有1进制 那么就是NaN
 // '3' 2 3是没有2进制的 所以NaN
 // 
 index是有范围的可选。表示要解析的数字的基数。该值介于 2 ~ 36 之间。

如果省略该参数或其值为 0,则数字将以 10 为基础来解析。

如果它以 “0x” 或 “0X” 开头,将以 16 为基数。

如果该参数小于 2 或者大于 36,则 parseInt() 将返回 NaN。
})

parseInt("10");			//返回 10
parseInt("19",10);		//返回 19 (9 + 1x10)
parseInt("11",2);		//返回 3 (1 + 1x2)
parseInt("17",8);		//返回 15 (7 + 1x8)
parseInt("1f",16);		//返回 31 (f=15 + 1x16)
parseInt("010");		//未定:返回 10 或 8

this指向

图片.png

图片.png

图片.png

注意点: 1 如果在函数原型上定义一个方法,但是这个函数并没有实例化,那么直接调用这个函数原型上的方法的时候,这个方法中的this不是指向函数,方法直接调用而是指向window

图片.png

定时器中的this,指向的是window

图片.png

图片.png

图片.png

数组去重的各种方法

方法1 for循环

function uniqueArr(array){
  var _arr = [],
  // 做一个是否重复的判断
      isRepeat;
  for(let i = 0; i< array.length;i++){
      isRepeat = false;
    for (let j=0; j<_arr.length;j++){
    // 如果循环_arr中有array中的数
     if(_arr[j] === array[i]){
     // 那么就设置为true
       isRepeat=true
    // 然后跳出这个循环
       break;
     }
    }
    // 只有这个判断为false的时候,才会把只push到_arr中
   if(!isRepeat){
     _arr.push(array[i])
   }
  }
  return _arr
 }
 
 uniqueArr([1,2,4,5,5,5,5,5,6,66,7,8,9])

方法2 for循环