hxrelam's Blog

2016-01-20发表技术随记2 分钟读完 (大约343个字)

今天突然收到测试反馈线上网页滚动加载不成功。当时还有点奇怪，之前测试的时候是可以正常加载数据呢！因此决定好好排查一下原因，点击这里查看demo，排查步骤如下：

// window.onscroll不能正常执行
window.onscroll = function () {
  console.log("running");
};

2015-12-14发表技术随记5 分钟读完 (大约675个字)

Java 和 Javascript 相互调用的实例

在用 HTML5 做跨平台应用开发时,尝尝会用到 java 和 js 方法互调的问题,对初学者而言,可能会有点难,在这里分享一些自己在实际开发过程中的用法,这里以单点登录的实现方法为例，希望对你有帮助。

2015-09-16发表技术随记8 分钟读完 (大约1238个字)

一个 Javascript 面试题引发的思考

最近一直在负责团队内部前端人员的招聘，前前后后估计也面试了二十几号人，由来自知名互联网、外包公司、非计算机专业、高中毕业生等等。本次不再过多的讨论前端人员面试面经，后面如果有时间的话会针对近期前端招聘详细的分析和总结。这里选取一道笔试题在笔试结果后引发的思考。

Javascript 面试题

题目：实现一个 URI 解析方法，把 url 里#之后的参数解析成指定的数据结构。

function urlParser(s) {
  // 答题部分，写出你的代码...
}
try {
  var url1 = "http://www.abc.com/m/s/#page/2/?type=latest_videos&page_size=20";
  var url2 = "http://www.abc.com/m/s/#type=latest_videos&page_size=20";
  var url3 = "http://www.abc.com/m/s/#page?type=latest_videos&page_size=20";
  console.log(urlParser(url1));
  console.log(urlParser(url2));
  console.log(urlParser(url3));

  /*----[执行结果]----
        ["page","2",{"type":"latest_videos","page_size":20}]
        [{"type":"latest_videos", "page_size":20}]
        ["page",{"type":"latest_videos","page_size":20}]
        ------------------*/
} catch (e) {
  console.error("执行出错，错误信息：" + e);
}

这道笔试题第一眼看上去比较简单，大部分同学的直接反应就是采用字符串分割 N 次，转换成数组即可。在我的印象中到目前为止，还没有一位同学写出完整的代码。大部分笔试结果如下：

2015-08-25发表技术随记2 分钟读完 (大约232个字)

Javascript 实现两个超大数字的相加

两个超大数字相加的实现

分析：由于数字类型长度限制，故两个超大数字应为字符串类型。因此两个超大数字相加实则为两个字符串按”加法规则“计算即可，下面是我的几个实现方式：

方法一：

function addTwoNum(str1, str2) {
  var carry = 0,
    l1 = str1.length,
    l2 = str2.length,
    arr = [];
  var max = Math.max(l1, l2);
  for (var i = l1 - 1, j = l2 - 1, n = max - 1; n >= 0; n--, i--, j--) {
    var sum = (+str1[i] || 0) + (+str2[j] || 0) + carry;
    if (sum >= 10) {
      carry = 1;
      arr.push(sum - 10);
    } else {
      carry = 0;
      arr.push(sum);
    }
  }
  if (carry > 0) arr.push(carry);
  return arr.reverse().join("");
}

方法二：

function addTwoNum(str1, str2) {
  var arr1 = str1.split("").reverse();
  var arr2 = str2.split("").reverse();
  var carry = 0,
    arr = [];
  var max = Math.max(arr1.length, arr2.length);
  var min = Math.min(arr1.length, arr2.length);

  for (var i = 0; i < max; i++) {
    var tmp = (+arr1[i] || 0) + (+arr2[i] || 0) + carry;
    if (tmp >= 10) {
      carry = 1;
      arr.push(tmp - 10);
    } else {
      carry = 0;
      arr.push(tmp);
    }
  }
  if (carry > 0) arr.push(carry);
  return arr.reverse().join("");
}

如果有错误之处，欢迎指正，谢谢！

2015-05-03发表技术随记6 分钟读完 (大约862个字)

移动端浏览器的私有 Meta 属性的整理

最近与浏览器客户端开发同学在探讨关于浏览器通用 Web API 实现方式，例如：横竖屏切换、日/夜间模式、全屏模式、页面模式等。
通过讨论并与欧朋（Opera）、QQ、UC 等浏览器团队进行相关交流，得到的结论————无内核开发的版本，很难彻底解决渲染、网络操作、安全等所带来的问题，
但也是可以通过应用层的某些技巧方式满足部分的需求。

今天主要是整理一下移动端浏览器的私有 Meta 属性的使用场景以及相关注释，以便查阅：

强制让文档的宽度与设备的宽度保持 1:1，并且文档最大的宽度比例是 1.0，且不允许用户点击屏幕放大浏览

<meta
  content="”width"
  ="device-width,"
  initial-scale="1.0,"
  maximum-scale="1.0,"
  user-scalable="0;”"
  name="”viewport”"
/>

iphone 设备中的 safari 私有 meta 标签，它表示：允许全屏模式浏览

1	<meta content="”yes”" name="”apple-mobile-web-app-capable”" />

iphone 的私有标签，它指定的 iphone 中 safari 顶端的状态条的样式

1	<meta content="”black”" name="”apple-mobile-web-app-status-bar-style”" />

告诉设备忽略将页面中的数字识别为电话号码

1	<meta content="”telephone" ="no”" name="”format-detection”" />

Javascript 面试题

分类

标签

最新文章