ZRW'blog


  • 首页

  • 标签

  • 分类

  • 归档

深入学习之——javascript 中的类型和值

发表于 2018-02-13

众所周知,JavaScript 中有七种内置类型:

  • 空值(null)
  • 未定义(undefined)
  • 布尔值(boolean)
  • 数字(number)
  • 字符串(string)
  • 对象(object)
  • 符号(symbol)

可以通过 typeof 运算符来查看值的类型。但是,这七种类型和它们的字符串值并非一一对应

1
2
3
4
5
6
7
8
9
typeof undefined === 'undefined';    // true
typeof true === 'boolean'; // true
typeof 12 === 'number'; // true
typeof '12' === 'string'; // true
typeof { number: 12 } === 'object'; // true
typeof Symbol() === 'symbol'; // true

// 而 null 有所不同
typeof null === 'null'; // false

事实上,对于 typeof null 的返回结果,是 object。这是 JavaScript 设计以来的一个 bug 。单单只用 typeof 运算符来检测 null 值的类型并不适用,因此我们需要用符合条件来检测:

1
2
var a = null;
(!a && typeof null === 'object'); // true
阅读全文 »

浮点数运算不精准的解决办法

发表于 2017-09-20

最近在红包小程序中,遇见一个很神奇的问题。在控制输入的数字最多只能包含两位小数的时候,输入 2.3 竟然会得到 2.29 。具体代码如下:

1
2
3
4
5
6
let temp = e.detail.value > parseInt(e.detail.value * 100) / 100 ? parseInt(e.detail.value * 100) / 100 : e.detail.value;
let tips = Number(temp) > parseInt(Number(temp) * 10) / 10 ? parseInt(Number(temp) * 10) / 10 : Number(temp);
this.setData({
orderValue: e.detail.value == '' ? '0.00' : temp,
tip: e.detail.value == '' ? '0.00' : parseFloat(tips*10, 10) / 100
})

这段代码的核心是判断 e.detail.value 的值是否多于两位小数,如果是的话,就舍去后面输入的数字,保持两位小数,并且把这个数赋值为 temp;再判断 temp 是否是两位小数,如果是,则舍去第二位小数后小数点左移一位,使得 tips 为 temp 的十分之一且最多只有两位小数。我的处理方式是,用 parseInt(e.detail.value * 100) 使得获得小数点右移两位的值,再将小数点左移两位或者截取到两位小数的数。然而问题在于,当 parseInt(2.3 * 100) 的时候,会得到 229 ,而不是总所周知的 230 ;而且,对于几乎做了一模一样操作的 tips 却没有任何影响。

查阅资料之后,发现,这是浮点数运算的问题。如果改用 parseFloat(e.detail.value * 100) 就能得到预期的 2.3 ,然而, parseFloat(e.detail.value * 100) 并不能解决保留两位小数的问题。

最终,我的解决方法是,用字符串截取的方式,解决了这个问题。代码如下:

1
2
3
4
5
6
7
8
9
let temp = e.detail.value;
// 保证 temp 的值是输入数字最多保留前两位小数的形式
temp = e.detail.value > parseInt(e.detail.value * 100) / 100 ? temp.split('.')[0] + '.' + temp.split('.')[1].substr(0,2) : e.detail.value;
// 使得 tips 为输入的数字最多保留一位小数的形式
let tips = Number(temp) > parseInt(Number(temp) * 10) / 10 ? parseInt(Number(temp) * 10) / 10 : Number(temp);
this.setData({
orderValue: e.detail.value == '' ? '0.00' : temp,
tip: e.detail.value == '' ? '0.00' : parseFloat(tips * 10, 10) / 100
})

然而,这并没有结束……

阅读全文 »

拖延癌晚期治疗

发表于 2017-09-03

如题,这是一篇拖延了很久很久的博文。

阅读全文 »

webpack 初探

发表于 2017-07-28

本篇是对于 wabpack 学习的笔记。由于 webpack 官方文档略微有点难读懂,所以这几天我一边看文档一边试着用 webpack 做了一个轮播组件。本篇博文主要是用来记录我在做这个组件的时候遇到的问题以及学到的内容。

阅读全文 »

JavaScript 函数式编程(二):柯里化函数与偏函数

发表于 2017-07-18

这是我在 JavaScript 函数式编程学习的第二篇笔记,写的内容是柯里化函数和偏函数。柯里化函数和偏函数都是高阶函数。因此,在进入正文之前,我想先描述一下,什么是高阶函数。

高阶函数至少满足以下一条特性:

  • 以一个函数作为参数
  • 返回值为一个函数

如下例子所示。这是一个简单的高阶函数。

阅读全文 »

javascript 函数式编程(一):Applicative 函子

发表于 2017-07-15

函数式编程逐渐成为一种编程流行趋势,不论是前端还是后端。函数是 JavaScript 的一等公民,JavaScript 当然支持函数式编程。

然而,我为什么选择学习函数式编程呢?仅仅因为它是一个热门的编程范式吗?

当然不是。我选择函数式编程的原因有:

  • 函数式编程是以函数作为行为单元,在一些情况下能避免 JavaScript 因为本身的缺陷而产生的一些问题,更为安全。
  • 函数式编程高度抽象,有利于函数单元的模块化,使代码更为简洁,更易于修改和维护。
  • 我渐渐意识到,目前我对于 JavaScript 的学习缺乏对于数据流的处理相关知识。而当前流行的 MV* 架构需要一定的对于数据的处理的能力。
阅读全文 »

深入理解 BFC

发表于 2017-06-06

我的博客长草了,特地前来除除草。今天想写的内容是 BFC 。
先前师兄师姐给我面试的时候,我听见 BFC 还觉得很陌生,之后研究了一番,发现,其实这是很普遍的一种解决一些常见问题的方式。于是在网络上看了许多文章,找了找 www.w3.org 里面关于这方面的解释,是以总结出以下这篇博文。

阅读全文 »

CscwPages项目总结

发表于 2016-08-24

暑假夏令营的最后一个礼拜,我们大一的捞仔们和Java组的两个小伙伴一起合作了CscwPages的项目。这是我们六个人第一次携手做一个项目,有很多东西需要学习与磨合的。
而且因为一个意外,我在遥远的惠州远程开发,所以分配給我的任务是较为离散的首页和联系我们部分。
这个部分的内容比较简单。基本上是页面的html+css的布局,没有什么难度系数大的js。对我来说在完成过程中比较有阻碍的还是讨论方面的问题。

阅读全文 »

记回忆满满又遗憾重重的夏天

发表于 2016-08-14

一开始让我写这篇总结的时候,我是拒绝的。因为我仔细数了数,暑假在学校的时间,大概也就半个月这样吧……但是我仔细想了想,美好的时光还是需要记录下来哒~

阅读全文 »

CSS布局有感

发表于 2016-08-08

随着最近做的页面数目的增多,积累的一些被坑的经验,对于页面布局方面,感受良多。
一开始也是知道对于一个页面来说,好的布局是基础,只有把这基础东西做好了,后面的功能实现才有可能。
于是,今天就把所踩过的,影响深刻的坑,都罗列出来。

阅读全文 »
12

zrw

记录个人学习笔记之地

12 日志
7 标签
© 2018 zrw
由 Hexo 强力驱动
|
主题 — NexT.Muse v5.1.4