日常记录-js篇

2019独角兽企业重金招聘Python工程师标准>>>

问：统计字符串中出现频率最多的字符

var str = "dhhafhhheeert",json = {};
for (var i = 0, l = str.length; i < l; i++) {
    json[str[i]] = (json[str[i]] + 1) || 1;
}
var temp_val = 1, temp_key = str[0];
for(var key in json){
    if(json[key] > temp_val){
        temp_key = key;
        temp_val = json[key];
    }   
}
alert(temp_key + ": " + temp_val);//-> h: 5

问：判断是否回文字符串，112232211，中间对称

function isHw(str){
  return str.split('').reverse().join('') == str
}

问：将输入的123转换成 ‘一百二十三’

 function getStr(num) {
    var counter = 0;
    var unitList = ['','十','百','千','万','十','百','千','亿','十','百','千','万'];
    var numStr = {'1':'一','2':'二','3':'三','4':'四','5':'五','6':'六','7':'七','8':'八','9':'九'}
    var numList = num.split('');
    var result = [];
    while (numList.length > 0) {
      oneNum = numList.pop();
      if (numStr['' + oneNum]) {
         result.push(numStr['' + oneNum] + unitList[counter]);
      }
      counter++
    }
    alert(result.reverse().join(''));
 }
   getStr('1234567890');

问：js浅拷贝

let a = [1, 2, 3]
let b = a
b.push(8)
b
[1, 2, 3, 8]
a
[1, 2, 3, 8]

为什么会这样？这是因为对象和数组是引用数据类型 ，这意味着这样的数据类型实际上并不保存值，而是存储指向存储单元的指针。将a赋值给b，其实我们只是创建了第二个指向同一存储单元的指针。要解决这个问题就需要进行深拷贝。

问：js深拷贝

//通用Object.assign
let b = Object.assign([],a);
let b = Objcet.assign({},a);

//数组
var arr = ["One","Two","Three"];
var arrtoo = arr.slice(0);

//对象
var deepCopy= function(source) { 
    var result={};
    for (var key in source) {
      result[key] = typeof source[key]===’object’? deepCoyp(source[key]): source[key];
    } 
    return result; 
}

 

问：合并两个对象

var o1 = { a: 1 };
var o2 = { b: 2 };
var o3 = { c: 3 };

var obj = Object.assign(o1, o2, o3);
console.log(obj); // { a: 1, b: 2, c: 3 }
console.log(o1); // { a: 1, b: 2, c: 3 }, 注意目标对象自身也会改变。

 

问：设置一个已知ID的div的内容，设置字体颜色

var div = document.getElementById(id);
div.innerHTML = ”;
div.style.color = ”;

 

问：DOM节点被点击执行函数

//1在dom中绑定
<div class="XX" onclick="test()"></div>
//2在js中绑定
var div = document.getElementById('id')
div.onclick= function(){}
//3.函数监听
addEventListener(xxx, ‘click’, test)

 

问：获取10~100中的随机数

分析

1 要获取10~100 可以先各减55  获取 -45~45                                     55来自（100+10）/2

2 要获取-45~45可以先各加45  获取0~90                                           45来自 （100-10）/2

3 要获取[0~90]闭区间，可通过 Math.floor(Math.random() * 91)       91来自 100-10+1

   要获取(0~90)开区间，可通过Math.ceil(Math.random() * 89)          89 来自 100-10-1

再逆向处理1和2

得到的结果是Math.floor(Math.random()*91) -45 + 55  [10,100]闭区间

              或者Math.ceil(Math.random() * 89) -45 + 55  (10,100)开区间

抽成方法如下

function getRegionNum(start, end) {
    //适用于闭区间
    return Math.floor(Math.random() * (end - start + 1)) + start;
    //适用于开区间
    //return Math.ceil(Math.random() * (end - start - 1)) + start;
}

 

问：去除字符串前后空格

//trim方法
" 1234 ".trim()
//正则表达式
" 1234 ".replace(/^\s+/, '').replace(/\s+$/, '')
或者
" 1234 ".replace(/(^\s+)|(\s+$)/, '')

 

问：根据下标删除数组元素

var arr=['a','b','c'];
//delete
delete arr[1]
//splice
arr.splice(start,count)//反回删除的元素

 

问：js单线程问题

为什么js是单线程？

JS最初被设计用在浏览器中,那么想象一下,如果浏览器中的JS是多线程的。假如js是多线程的，存在两个线程process1,process2,他们对同一个dom,同时进行操作,process1 删除了该dom,而process2 编辑了该dom,同时下达2个矛盾的命令,浏览器究竟该如何执行呢?

js为什么要异步?

如果JS中不存在异步,只能自上而下执行,如果上一行解析时间很长,那么下面的代码就会被阻塞。对于用户而言,阻塞就意味着"卡死",这样就导致了很差的用户体验.

js如何实现异步？

（1）所有同步任务都在主线程上执行，形成一个执行栈（execution context stack）。

（2）主线程之外，还存在一个"任务队列"（task queue）。只要异步任务有了运行结果，就在"任务队列"之中放置一个事件。

（3）一旦"执行栈"中的所有同步任务执行完毕，系统就会读取"任务队列"，看看里面有哪些事件。那些对应的异步任务，于是结束等待状态，进入执行栈，开始执行。

（4）主线程不断重复上面的第三步。

js是单线程的，那么谁去轮询 Event loop事件队列？

虽然JS运行在浏览器中，是单线程的，每个window只有一个JS线程，但浏览器不是单线程的，例如Webkit或是Gecko引擎，都可能有如下线程：

• javascript引擎线程
• 界面渲染线程
• 浏览器事件触发线程
• Http请求线程

转载于:https://my.oschina.net/kimyeongnam/blog/1836244