From e588fd2b905cd3f677c2c60e30f2b22b0bbea4e4 Mon Sep 17 00:00:00 2001 From: qianguyihao Date: Thu, 20 Dec 2018 21:08:55 +0800 Subject: [PATCH] =?UTF-8?q?update:=E6=95=B0=E6=8D=AE=E7=B1=BB=E5=9E=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../02-JavaScript语法基础：变量.md | 194 +---------------- .../03-JavaScript语法基础：强制类型转换.md | 199 ++++++++++++++++++ ...达式.md => 04-JavaScript语法基础：运算符和表达式.md} | 0 ...md => 05-JavaScript语法基础：循环控制（if语句&for循环）.md} | 0 .../{05-对象简介.md => 06-对象简介.md} | 0 03-JavaScript基础/{05-函数.md => 07-函数.md} | 0 ...、作用域和this.md => 08-对象、作用域和this.md} | 0 ...函数和原型.md => 09-对象的创建、构造函数和原型.md} | 0 03-JavaScript基础/{08-数组.md => 10-数组.md} | 2 + .../{09-内置对象.md => 12-内置对象.md} | 0 .../{10-DOM操作.md => 13-DOM操作.md} | 0 ...象Event和冒泡.md => 14-事件对象Event和冒泡.md} | 0 .../{13-事件委托.md => 15-事件委托.md} | 0 ...和内置对象.md => 16-BOM的常见内置方法和内置对象.md} | 0 .../{14-原型链.md => 17-原型链.md} | 0 20-前端综合/2018年-前端日记.md | 4 + 23-推荐连接/01-推荐网站.md | 8 +- 17 files changed, 218 insertions(+), 189 deletions(-) create mode 100644 03-JavaScript基础/03-JavaScript语法基础：强制类型转换.md rename 03-JavaScript基础/{03-JavaScript语法基础：运算符和表达式.md => 04-JavaScript语法基础：运算符和表达式.md} (100%) rename 03-JavaScript基础/{04-JavaScript语法基础：循环控制（if语句&for循环）.md => 05-JavaScript语法基础：循环控制（if语句&for循环）.md} (100%) rename 03-JavaScript基础/{05-对象简介.md => 06-对象简介.md} (100%) rename 03-JavaScript基础/{05-函数.md => 07-函数.md} (100%) rename 03-JavaScript基础/{06-对象、作用域和this.md => 08-对象、作用域和this.md} (100%) rename 03-JavaScript基础/{07-对象的创建、构造函数和原型.md => 09-对象的创建、构造函数和原型.md} (100%) rename 03-JavaScript基础/{08-数组.md => 10-数组.md} (99%) rename 03-JavaScript基础/{09-内置对象.md => 12-内置对象.md} (100%) rename 03-JavaScript基础/{10-DOM操作.md => 13-DOM操作.md} (100%) rename 03-JavaScript基础/{12-事件对象Event和冒泡.md => 14-事件对象Event和冒泡.md} (100%) rename 03-JavaScript基础/{13-事件委托.md => 15-事件委托.md} (100%) rename 03-JavaScript基础/{13-BOM的常见内置方法和内置对象.md => 16-BOM的常见内置方法和内置对象.md} (100%) rename 03-JavaScript基础/{14-原型链.md => 17-原型链.md} (100%) diff --git a/03-JavaScript基础/02-JavaScript语法基础：变量.md b/03-JavaScript基础/02-JavaScript语法基础：变量.md index 14163f5..5300994 100644 --- a/03-JavaScript基础/02-JavaScript语法基础：变量.md +++ b/03-JavaScript基础/02-JavaScript语法基础：变量.md @@ -390,7 +390,7 @@ Undefined和任何数值计算的结果为NaN。NaN 与任何值都不相等， a2 ``` -于是我们明白了，在变量中加入字符串进行连接，可以被同化为字符串。【重要】 +于是我们明白了，在变量中加入字符串进行拼接，可以被同化为字符串。【重要】 ### 隐式转换 @@ -415,7 +415,7 @@ Undefined和任何数值计算的结果为NaN。NaN 与任何值都不相等， ## 布尔值：Boolean -true 和 fase。 +true 和 fase。主要用来做逻辑判断。 布尔值直接使用就可以了，千万不要加上引号。 @@ -437,7 +437,7 @@ true 和 fase。 ### `null`：空值 -专门用来表示一个为空的**对象**。（注意，专门用来表示**空对象**） +专门用来表示一个为空的**对象**（例如：`var a = null`）。注意，专门用来表示**空对象**。 - Null类型的值只有一个，就是null。比如：`var a = null`。 @@ -447,7 +447,7 @@ true 和 fase。 ### `undefined`：未定义 -**声明**一个变量，但是没有**赋值**，此时它的值就是undefined。例如：`var a;` +**声明**了一个变量，但是没有**赋值**（例如：`var a;`），此时它的值就是undefined。 - Undefined类型的值只有一个，就是undefind @@ -455,7 +455,7 @@ true 和 fase。 null和undefined有最大的相似性。看看null == undefined的结果(true)也就更加能说明这点。 -但是null === undefined的结果(false)。不过相似归相似，还是有区别的，就是和数字运算时，10 + null结果为：10；10 + undefined结果为：NaN。 +但是null === undefined的结果(false)。它们虽然相似，但还是有区别的，其中一个区别是：和数字运算时，10 + null结果为：10；10 + undefined结果为：NaN。 - 任何数据类型和undefined运算都是NaN; @@ -575,192 +575,10 @@ null和undefined有最大的相似性。看看null == undefined的结果(true) 1 ``` -## 强制类型转换 - -强制类型转换：将一个数据类型强制转换为其他的数据类型。 - -类型转换主要指，将其他的数据类型，转换为：String、Number、Boolean。 - -### prompt()：用户的输入 - -我们在上面的内容里讲过，`prompt()`就是专门用来弹出能够让用户输入的对话框。重要的是：用户不管输入什么，都是字符串。 - -### 任何简单类型转换成String - -**方法一**：变量+"" 或者 变量+"abc" - -**方法二**：调用toString()方法。如下： - -``` -变量.toSting() -``` - -【重要】该方法**不会影响到原变量**，它会将转换的结果返回。当然我们还可以直接写成`a = a.toString()`，这样的话，就是直接修改原变量。 - -注意：null和undefined这两个值没有toString()方法，所以它们不能用方法二。如果调用，会报错。 - - - -另外，Number类型的变量，在调用toString()时，可以在方法中传递一个整数作为参数。此时它将会把数字转换为指定的进制，如果不指定则默认转换为10进制。例如： - -```javascript - var a = 255; - - //对于Number调用toString()时可以在方法中传递一个整数作为参数 - //此时它将会把数字转换为指定的进制,如果不指定则默认转换为10进制 - a = a.toString(2); - - console.log(a); // 11111111 - console.log(typeof a); // string -``` - - - -**方法三**：调用String()函数。如下： - -``` -String(变量) -``` - -使用String()函数做强制类型转换时： - -- 对于Number和Boolean而言，实际上就是调用toString()方法。 - -- 但是对于null和undefined，就不会调用toString()方法。它会将 null 直接转换为 "null"。将 undefined 直接转换为 "undefined"。 - -### Number()函数：其他的数据类型 --> Number - -情况一：字符串 --> 数字 - -- 1.如果字符串中是纯数字，则直接将其转换为数字。 - -- 2.如果字符串中有非数字的内容，则转换为NaN。（此处可以看到Number()函数的局限性） - -- 3.如果字符串是一个空串或者是一个全是空格的字符串，则转换为0。 - -情况二：布尔 --> 数字 - -- true 转成 1 - -- false 转成 0 - -情况三：null --> 数字 - -- 结果为：0 - -情况四：undefined --> 数字 - -- 结果为：NaN - -### `parseInt()`：字符串 --> 整数【重要】 - -> `parseInt()`是专门用来对付字符串的。 - -**parseInt()的作用是将字符串转为数字**。parse表示“转换”，Int表示“整数”（注意`Int`的拼写）。例如： - -``` - parseInt("5"); -``` - -得到的结果是数字5。 - -**parseInt()还具有以下特性**： - -（1）**只保留字符串最开头的数字**，后面的中文自动消失。例如： - -``` - console.log(parseInt("2017在公众号上写了6篇文章")); //打印结果：2017 - - console.log(parseInt("2017.01在公众号上写了6篇文章")); //打印结果仍是：2017 （说明只会取整数） - - console.log(parseInt("aaa2017.01在公众号上写了6篇文章")); //打印结果：NaN -``` - -（2）自动带有截断小数的功能：**取整，不四舍五入**。 - -例1： - -```javascript - var a = parseInt(5.8) + parseInt(4.7); - console.log(a); -``` - -控制台输出： - -``` - 9 -``` - -例2： - -```javascript - var a = parseInt(5.8 + 4.7); - console.log(a); -``` - -控制台输出： - -```javascript - 10 -``` - -（3）如果对**非String**使用parseInt()或parseFloat()，它会**先将其转换为String**然后再操作。 - -比如： - -```javascript - var a = true; - console.log(parseInt(a)); //打印结果：NaN （因为是先将a转为字符串"true"，然后然后再操作） - - var b = undefined; - console.log(parseInt(b)); //打印结果：NaN （因为是先将b转为字符串"undefined"，然后然后再操作） - - var c = 168.23; - console.log(parseInt(c)); //打印结果：168 （因为是先将c转为字符串"168.23"，然后然后再操作） - -``` - -（4）带两个参数时，表示进制转换。 - -### `parseFloat()`：字符串 --> 浮点数（小数） - -> `parseFloat()`是专门用来对付字符串的。 - -道理同上。 - -### 转换为Boolean - -> 将其他的数据类型转换为Boolean，可以使用Boolean()函数。 - -- 情况一：数字 --> 布尔。除了0和NaN，其余的都是true。 - -- 情况二：字符串 ---> 布尔。除了空串，其余的都是true。 - -- 情况三：null和undefined都会转换为false。 - -- 情况四：对象也会转换为true。 - -## 其他进制的数字 - -- 16进制的数字，以`0x`开头 - -- 8进制的数字，以`0`开头 - -- 2进制的数字，`0b`开头（不是所有的浏览器都支持：chrome和火狐支持，IE不支持） - -比如`070`这个字符串，如果我调用parseInt()转成数字时，有些浏览器会当成8进制解析，有些会当成10进制解析。 - -所以，比较建议的做法是：可以在parseInt()中传递第二个参数，来指定数字的进制。例如： - -```javascript - a = "070"; - - a = parseInt(a,10); //转换成十进制 -``` ## 我的公众号 -想学习**代码之外的软技能**？不妨关注我的微信公众号：**生命团队**（id：`vitateam`）。 +想学习**代码之外的软技能**？不妨关注我的微信公众号：**千古壹号**（id：`qianguyihao`）。 扫一扫，你将发现另一个全新的世界，而这将是一场美丽的意外： diff --git a/03-JavaScript基础/03-JavaScript语法基础：强制类型转换.md b/03-JavaScript基础/03-JavaScript语法基础：强制类型转换.md new file mode 100644 index 0000000..4b0be81 --- /dev/null +++ b/03-JavaScript基础/03-JavaScript语法基础：强制类型转换.md @@ -0,0 +1,199 @@ +## 前言 + +强制类型转换：将一个数据类型强制转换为其他的数据类型。 + +类型转换主要指，将其他的数据类型，转换为：String、Number、Boolean。你会把某个数据类型转换成 null 或者 undefined 吗？不会，因为这样做，没有意义。 + + + + +## 任何简单类型转换成String + +### 方法一：变量+"" 或者 变量+"abc" + + +举例如下： + +```javascript + + +``` + + +### 方法二：调用toString()方法 + +举例如下： + +``` +变量.toSting() +``` + +【重要】该方法**不会影响到原变量**，它会将转换的结果返回。当然我们还可以直接写成`a = a.toString()`，这样的话，就是直接修改原变量。 + +注意：null和undefined这两个值没有toString()方法，所以它们不能用方法二。如果调用，会报错。 + + + +另外，Number类型的变量，在调用toString()时，可以在方法中传递一个整数作为参数。此时它将会把数字转换为指定的进制，如果不指定则默认转换为10进制。例如： + +```javascript + var a = 255; + + //对于Number调用toString()时可以在方法中传递一个整数作为参数 + //此时它将会把数字转换为指定的进制,如果不指定则默认转换为10进制 + a = a.toString(2); + + console.log(a); // 11111111 + console.log(typeof a); // string +``` + + + +### 方法三**：调用String()函数。 + +格式如下： + +``` +String(变量) +``` + +使用String()函数做强制类型转换时： + +- 对于Number和Boolean而言，实际上就是调用toString()方法。 + +- 但是对于null和undefined，就不会调用toString()方法。它会将 null 直接转换为 "null"。将 undefined 直接转换为 "undefined"。 + + +### prompt()：用户的输入 + +我们在上面的内容里讲过，`prompt()`就是专门用来弹出能够让用户输入的对话框。重要的是：用户不管输入什么，都是字符串。 + +## Number()函数：其他的数据类型 --> Number + +情况一：字符串 --> 数字 + +- 1.如果字符串中是纯数字，则直接将其转换为数字。 + +- 2.如果字符串中有非数字的内容，则转换为NaN。（此处可以看到Number()函数的局限性） + +- 3.如果字符串是一个空串或者是一个全是空格的字符串，则转换为0。 + +情况二：布尔 --> 数字 + +- true 转成 1 + +- false 转成 0 + +情况三：null --> 数字 + +- 结果为：0 + +情况四：undefined --> 数字 + +- 结果为：NaN + +### `parseInt()`：字符串 --> 整数【重要】 + +> `parseInt()`是专门用来对付字符串的。 + +**parseInt()的作用是将字符串转为数字**。parse表示“转换”，Int表示“整数”（注意`Int`的拼写）。例如： + +``` + parseInt("5"); +``` + +得到的结果是数字5。 + +**parseInt()还具有以下特性**： + +（1）**只保留字符串最开头的数字**，后面的中文自动消失。例如： + +``` + console.log(parseInt("2017在公众号上写了6篇文章")); //打印结果：2017 + + console.log(parseInt("2017.01在公众号上写了6篇文章")); //打印结果仍是：2017 （说明只会取整数） + + console.log(parseInt("aaa2017.01在公众号上写了6篇文章")); //打印结果：NaN +``` + +（2）自动带有截断小数的功能：**取整，不四舍五入**。 + +例1： + +```javascript + var a = parseInt(5.8) + parseInt(4.7); + console.log(a); +``` + +控制台输出： + +``` + 9 +``` + +例2： + +```javascript + var a = parseInt(5.8 + 4.7); + console.log(a); +``` + +控制台输出： + +```javascript + 10 +``` + +（3）如果对**非String**使用parseInt()或parseFloat()，它会**先将其转换为String**然后再操作。 + +比如： + +```javascript + var a = true; + console.log(parseInt(a)); //打印结果：NaN （因为是先将a转为字符串"true"，然后然后再操作） + + var b = undefined; + console.log(parseInt(b)); //打印结果：NaN （因为是先将b转为字符串"undefined"，然后然后再操作） + + var c = 168.23; + console.log(parseInt(c)); //打印结果：168 （因为是先将c转为字符串"168.23"，然后然后再操作） + +``` + +（4）带两个参数时，表示进制转换。 + +### `parseFloat()`：字符串 --> 浮点数（小数） + +> `parseFloat()`是专门用来对付字符串的。 + +道理同上。 + +## 转换为Boolean + +> 将其他的数据类型转换为Boolean，可以使用Boolean()函数。 + +- 情况一：数字 --> 布尔。除了0和NaN，其余的都是true。 + +- 情况二：字符串 ---> 布尔。除了空串，其余的都是true。 + +- 情况三：null和undefined都会转换为false。 + +- 情况四：对象也会转换为true。 + +## 其他进制的数字 + +- 16进制的数字，以`0x`开头 + +- 8进制的数字，以`0`开头 + +- 2进制的数字，`0b`开头（不是所有的浏览器都支持：chrome和火狐支持，IE不支持） + +比如`070`这个字符串，如果我调用parseInt()转成数字时，有些浏览器会当成8进制解析，有些会当成10进制解析。 + +所以，比较建议的做法是：可以在parseInt()中传递第二个参数，来指定数字的进制。例如： + +```javascript + a = "070"; + + a = parseInt(a,10); //转换成十进制 +``` diff --git a/03-JavaScript基础/03-JavaScript语法基础：运算符和表达式.md b/03-JavaScript基础/04-JavaScript语法基础：运算符和表达式.md similarity index 100% rename from 03-JavaScript基础/03-JavaScript语法基础：运算符和表达式.md rename to 03-JavaScript基础/04-JavaScript语法基础：运算符和表达式.md diff --git a/03-JavaScript基础/04-JavaScript语法基础：循环控制（if语句&for循环）.md b/03-JavaScript基础/05-JavaScript语法基础：循环控制（if语句&for循环）.md similarity index 100% rename from 03-JavaScript基础/04-JavaScript语法基础：循环控制（if语句&for循环）.md rename to 03-JavaScript基础/05-JavaScript语法基础：循环控制（if语句&for循环）.md diff --git a/03-JavaScript基础/05-对象简介.md b/03-JavaScript基础/06-对象简介.md similarity index 100% rename from 03-JavaScript基础/05-对象简介.md rename to 03-JavaScript基础/06-对象简介.md diff --git a/03-JavaScript基础/05-函数.md b/03-JavaScript基础/07-函数.md similarity index 100% rename from 03-JavaScript基础/05-函数.md rename to 03-JavaScript基础/07-函数.md diff --git a/03-JavaScript基础/06-对象、作用域和this.md b/03-JavaScript基础/08-对象、作用域和this.md similarity index 100% rename from 03-JavaScript基础/06-对象、作用域和this.md rename to 03-JavaScript基础/08-对象、作用域和this.md diff --git a/03-JavaScript基础/07-对象的创建、构造函数和原型.md b/03-JavaScript基础/09-对象的创建、构造函数和原型.md similarity index 100% rename from 03-JavaScript基础/07-对象的创建、构造函数和原型.md rename to 03-JavaScript基础/09-对象的创建、构造函数和原型.md diff --git a/03-JavaScript基础/08-数组.md b/03-JavaScript基础/10-数组.md similarity index 99% rename from 03-JavaScript基础/08-数组.md rename to 03-JavaScript基础/10-数组.md index b88a53f..27725e7 100644 --- a/03-JavaScript基础/08-数组.md +++ b/03-JavaScript基础/10-数组.md @@ -250,6 +250,8 @@ arguments代表的是实参。有个讲究的地方是：arguments**只在函数 上面的这个带参的排序，其实是调用了底层的**冒泡排序**，小的排前面，大的排后面。 +注意，执行sort()方法后，原数组也会发生变化。 + PS：sort方法的功能非常强大，能对数字和字母进行排列。 ## 数组的一些其他方法 diff --git a/03-JavaScript基础/09-内置对象.md b/03-JavaScript基础/12-内置对象.md similarity index 100% rename from 03-JavaScript基础/09-内置对象.md rename to 03-JavaScript基础/12-内置对象.md diff --git a/03-JavaScript基础/10-DOM操作.md b/03-JavaScript基础/13-DOM操作.md similarity index 100% rename from 03-JavaScript基础/10-DOM操作.md rename to 03-JavaScript基础/13-DOM操作.md diff --git a/03-JavaScript基础/12-事件对象Event和冒泡.md b/03-JavaScript基础/14-事件对象Event和冒泡.md similarity index 100% rename from 03-JavaScript基础/12-事件对象Event和冒泡.md rename to 03-JavaScript基础/14-事件对象Event和冒泡.md diff --git a/03-JavaScript基础/13-事件委托.md b/03-JavaScript基础/15-事件委托.md similarity index 100% rename from 03-JavaScript基础/13-事件委托.md rename to 03-JavaScript基础/15-事件委托.md diff --git a/03-JavaScript基础/13-BOM的常见内置方法和内置对象.md b/03-JavaScript基础/16-BOM的常见内置方法和内置对象.md similarity index 100% rename from 03-JavaScript基础/13-BOM的常见内置方法和内置对象.md rename to 03-JavaScript基础/16-BOM的常见内置方法和内置对象.md diff --git a/03-JavaScript基础/14-原型链.md b/03-JavaScript基础/17-原型链.md similarity index 100% rename from 03-JavaScript基础/14-原型链.md rename to 03-JavaScript基础/17-原型链.md diff --git a/20-前端综合/2018年-前端日记.md b/20-前端综合/2018年-前端日记.md index 4d437a2..f83babb 100644 --- a/20-前端综合/2018年-前端日记.md +++ b/20-前端综合/2018年-前端日记.md @@ -376,6 +376,10 @@ css实现圆环进度条： + diff --git a/23-推荐连接/01-推荐网站.md b/23-推荐连接/01-推荐网站.md index c5e9958..6237f32 100644 --- a/23-推荐连接/01-推荐网站.md +++ b/23-推荐连接/01-推荐网站.md @@ -6,7 +6,7 @@ - 前端面试图谱： -这个项目已经很全面了，是从面试的角度出发的。我自己的项目，是从基础入门的角度出发的。我自己的项目是，是从基础入门的角度出发的。可以起到互补的作用。 +这个项目已经很全面了，是从面试的角度出发的。我自己的项目是，是从基础入门的角度出发的。可以起到互补的作用。 ### 2018-11-27 @@ -21,3 +21,9 @@ css的各种效果实现（尤其是动画效果），关键时刻能救命。作者内化后输出，并贡献出来。这种也是颇为难得了。很有极客精神。 + +### 2018-12-17 + +- github排行： + +s \ No newline at end of file