分类 Web笔记 下的文章

Javascript中什么时候需要用\转义字符?

有这样一种情景:

使用nodejs读取一个文件,假设这个文件只有一行字符串,内容如下:

C:\notmydocument\treen\s.zip

然后我们需要将读取的文件内容作为一个参数(字符串)传入某个函数,这时候,我们是不是需要担心开头的\n被转换成换行符了?

content=content.replace(/\\/g,'\\')

↑要再执行一次转换?这样处理是否OK?(不需要也不能)

其实没有那么复杂,简单地说,只有当“输入”字符串的时候,并且遇到要输入特殊的字符的时候,才需要用到\符号。

这个输入是指我们用键盘定义字面量的时候,比如我们需要给一个变量书面赋值What's the name of \ key?

var strt='What\'s the name of \\ key?'

上面有两个地方进行了转义,'\两个字符,由于外部用了'来定义字符串,冲突了,所以字符串内部需要转义',而\这个字符本身作为转义符,要输入其自身就需要\\这样输入;

再举一个例子:

当定义正则表达式时候,如果用书面定义,为var r=/\\/ ,如果用new RegExp的话,需要写成下面的形式:

var r= new RegExp('\\\\');

为什么要重复这么多次呢呢呢呢?

因为RegExp第一个参数为一个字符串,我们需要的字符串是\\,然后我们用键盘输入\\这个字符串,就需要输入为\\\\了。

最后再强调一下:只有当用户用字面量去定义一个字符串的时候,特殊字符需要用到\来转移,其余时候不用转义。

CSS渐变,终结篇

你常用CSS渐变吗?

如果回答是不,那么很可能是被它复杂的语法吓到了,且不说不同浏览器,即使是很赶时髦的Chrome,也经历了3个阶段,好在目前渐变规范进入了w3c草案,慢慢地终于“稳定”了下来。为避免混淆,本文只使用最新的语法。

题目叫终结篇,意思是看完这篇文章就不再纠结了。

什么是渐变

渐变本质是一种image,所以应该是background-image而不是background-color的值。渐变大体分两种,线性linear和径向radial,还有重复渐变是这两种渐变的特殊形式。

线性渐变linear-gradient

基本语法:

background-image: linear-gradient(red, yellow);

linear-gradient

- 阅读剩余部分 -

JS的真真假假,看完会更清晰

Javascript的true和false很灵活,刚接触的时候用得很欢快,js真是智能,还能自动转换数据类型,太方便了,所以对于下面的情况的时候,大家不会觉得奇怪:

"0" == false; //true
"0" === false; //false

不过越是智能的东西越不要太相信了(比如说人),有时候会自作聪明的。

最近发现,有一位很有耐心的人做了这样一张表:

JS Comparison Table

点击这里打开 JS Comparison Table

确实很方便直观,但如果每次都来查表、甚至想背下来,估计难度不小,平时如果遇到了,也多是“噢,原来这里该这样”就过去了,谈到具体的原理,大家都说,啊,这是js的特点,因为js会进行类型转换,怎么转换的?好像没有太多讨论,最后就产生了js是在进行暗箱操作的感觉。

“被教育”最多的话就是:js里面的==是恶魔,和eval一样不要用,判断等不等要用===
我:哦

(然后一直带着不安的心情在使用==

直到最近,看到这样一条奇怪的语句:

if ("0"){ console.log("ha") }; //"ha"

这个怎么解释?是js的设计bug?我觉得不会吧,计算机也是人造的,总还是有规律的,即便是看起来的bug,也是有原理的。

我觉得以及忍无可忍了,必!须!知!道!原!理!

老规矩,先到MDN上面看看呗,哦,真幸运,果然找到了想要的原理。简单挑选了几条,涉及到==的判断原则、以及if中的条件判断原则。

1、使用==比较的时候

当比较的两边类型一样时候,比较容易,这里略过,只讨论类型不同时的比较。

  • number和string比较的时候,string会被转换为number值

  • ==两边的比较方如果有一方是Boolean类型,Boolean为true的时候会被转换为1,false时候转换为+0

  • object和number或string比较,object被通过valueOf和toString方法转换为它的原始值(primitive value)——为String或者Number值;如果转换失败,会报错(runtime error运行时错误)


- 阅读剩余部分 -

字符串+正则相关函数汇总

有这样几个和字符串替换中经常使用到的函数:replacematchsearchexectest,老是混淆,这里列出来对比。

前三个是字符串的方法,后面两个方法属于正则式。


String相关的函数:

1. replace

调用方法:str.replace(regexp|substr, newSubStr|function)

注意点:如果第一个参数为字符串或者非全局g的正则,替换只会发生一次。

'aaaa'.replace('a','b')==='baaa';
'aaaa'.replace(/a/,'b')==='baaa';
'aaaa'.replace(/a/g,'b')==='bbbb';

使用字符串作为第二个参数的时候,替换字符串newSubStr可以插入下面的特殊变量名

变量名代表的值
$$插入字符串 "$".
$&插入第一个参数所匹配的子串
$`插入匹配子串左边的内容.
$'插入匹配子串右边的内容.
$n or $nn如果n或nn是个十进制的数字,并且replace方法的第一个参数是个正则表达式,那么$n表示正则表达式中的第n个子匹配字符串.

- 阅读剩余部分 -

[译]GoogleChrome开发者工具快捷键

开发者工具有一些内置的快捷键,可以帮助大家在日常工作中节省时间。下面是一些快捷方式已以及对应的快捷键(Windows/Linux/Mac),有一些快捷键是全局的,有一些是特定面板才有的。

打开开发者工具

在谷歌浏览器里面你可以使用以下的方式打开:

  • 浏览器右上角的菜单里面选择--更多工具--开发者工具

  • 在任何页面当中右击选择--审查元素

XWindows / LinuxMac
打开开发者工具F12, Ctrl + Shift + ICmd + Opt + I
在审查窗口和浏览窗口之间切换Ctrl + Shift + CCmd + Shift + C
打开开发者工具并且切换到控制台Ctrl + Shift + JCmd + Opt + J
审查审查器(需要先脱离浏览窗口)Ctrl + Shift + ICmd + Opt + I

当开发者工具窗口打开的时候,键入 ? or F1 打开常规设置; Esc 关闭设置对话框。

所有面板

- 阅读剩余部分 -