diff --git a/04-JavaScript基础/10-包装类.md b/04-JavaScript基础/10-包装类.md new file mode 100644 index 0000000..c3997ea --- /dev/null +++ b/04-JavaScript基础/10-包装类.md @@ -0,0 +1,157 @@ + + + +## 包装类的介绍 + +我们都知道,js中的数据类型包括以下几种。 + +- 基本数据类型:String、Number、Boolean、Null、Undefined + +- 引用数据类型:Object + +JS为我们提供了**三个包装类**: + +- String():将基本数据类型字符串,转换为String对象。 + +- Number():将基本数据类型的数字,转换为Number对象。 + +- Boolean():将基本数据类型的布尔值,转换为Boolean对象。 + +通过上面这这三个包装类,我们可以**将基本数据类型的数据转换为对象**。 + + +代码举例: + +```javascript + var num = new Number(3); + + var str = new String("hello"); + + var bool = new Boolean(true); + + console.log(typeof num); // 打印结果:object +``` + + +**需要注意的是**:我们在实际应用中不会使用基本数据类型的对象。如果使用基本数据类型的对象,在做一些比较时可能会带来一些**不可预期**的结果。 + +比如说: + +```javascript + var boo1 = new Boolean(true); + var boo2 = new Boolean(true); + + console.log(boo1 === boo2); // 打印结果竟然是:false +``` + + +再比如说: + +```javascript +var boo3 = new Boolean(false); + +if (boo3) { + console.log('qianguyihao'); // 这行代码竟然执行了 +} +``` + + +## 基本数据类型不能绑定属性和方法 + +属性和方法只能添加给对象,不能添加给基本数据类型。 + +**1、基本数据类型:** + +注意,基本数据类型`string`是**无法绑定属性和方法**的。比如说: + +```javascript + var str = "qianguyihao"; + + str.aaa = 12; + console.log(typeof str); //打印结果为:string + console.log(str.aaa); //打印结果为:undefined +``` + +上方代码中,当我们尝试打印`str.aaa`的时候,会发现打印结果为:undefined。也就是说,不能给 `string` 绑定属性和方法。 + +当然,我们可以打印str.length、str.indexOf("m")等等。因为这两个方法的底层做了数据类型转换(**临时**将 `string` 字符串转换为 `String` 对象,然后再调用内置方法),也就是我们在上一篇文章中讲到的**包装类**。 + +**2、引用数据类型:** + +引用数据类型`String`是可以绑定属性和方法的。如下: + +```javascript + var strObj = new String("smyhvae"); + strObj.aaa = 123; + console.log(strObj); + console.log(typeof strObj); //打印结果:Object + console.log(strObj.aaa); +``` + +打印结果: + +![](http://img.smyhvae.com/20180202_1351.png) + +内置对象Number也有一些自带的方法,比如: + +- Number.MAX_VALUE; + +- Number.MIN_VALUE; + +内置对象Boolean也有一些自带的方法,但是用的不多。 + +## 基本包装类型【重要】 + +当我们对一些基本数据类型的值去调用属性和方法时,浏览器会**临时使用包装类将基本数据类型转换为引用数据类型**,这样的话,基本数据类型就有了属性和方法,然后再调用对象的属性和方法;调用完以后,再将其转换为基本数据类型。 + +举例: + +```js +var str = 'qianguyihao'; +console.log(str.length); // 打印结果:11 + +``` + +比如,上面的代码,执行顺序是这样的: + +```js +// 步骤(1):把简单数据类型 string 转换为 引用数据类型 String,保存到临时变量中 +var temp = new String('qianguyihao); + +// 步骤(2):把临时变量的值 赋值给 str +str = temp; + +// 步骤(3):销毁临时变量 +temp = null; + +``` + +### 在底层,字符串以字符数组的形式保存 + +在底层,字符串是以字符数组的形式保存的。代码举例: + +```javascript + var str = "smyhvae"; + console.log(str.length); // 获取字符串的长度 + console.log(str[2]); // 获取字符串中的第2个字符 +``` + +上方代码中,`smyhvae`这个字符串在底层是以`["s", "m", "y", "h", "v", "a", "e"]`的形式保存的。因此,我们既可以获取字符串的长度,也可以获取指定索引index位置的单个字符。这很像数组中的操作。 + + + +再比如,String 对象的很多内置方法,也可以直接给字符串用。此时,也是临时将字符串转换为 String 对象,然后再调用内置方法。 + + + +## 我的公众号 + +想学习**代码之外的技能**?不妨关注我的微信公众号:**千古壹号**(id:`qianguyihao`)。 + +扫一扫,你将发现另一个全新的世界,而这将是一场美丽的意外: + +![](http://img.smyhvae.com/20190101.png) + + + + diff --git a/04-JavaScript基础/13-内置对象:String.md b/04-JavaScript基础/13-内置对象:String.md index e103a35..3ca59ad 100644 --- a/04-JavaScript基础/13-内置对象:String.md +++ b/04-JavaScript基础/13-内置对象:String.md @@ -3,61 +3,6 @@ > 在日常开发中,String对象的使用频率是非常高的。所以有必要详细介绍。 -### 基本数据类型不能绑定属性和方法 - -**1、基本数据类型:** - -注意,基本数据类型`string`是**无法绑定属性和方法**的。比如说: - -```javascript - var str = "qianguyihao"; - - str.aaa = 12; - console.log(typeof str); //打印结果为:string - console.log(str.aaa); //打印结果为:undefined -``` - -上方代码中,当我们尝试打印`str.aaa`的时候,会发现打印结果为:undefined。也就是说,不能给 `string` 绑定属性和方法。 - -当然,我们可以打印str.length、str.indexOf("m")等等。因为这两个方法的底层做了数据类型转换(**临时**将 `string` 字符串转换为 `String` 对象,然后再调用内置方法),也就是我们在上一篇文章中讲到的**包装类**。 - -**2、引用数据类型:** - -引用数据类型`String`是可以绑定属性和方法的。如下: - - -```javascript - var strObj = new String("smyhvae"); - strObj.aaa = 123; - console.log(strObj); - console.log(typeof strObj); //打印结果:Object - console.log(strObj.aaa); -``` - -打印结果: - -![](http://img.smyhvae.com/20180202_1351.png) - -内置对象Number也有一些自带的方法,比如: - -- Number.MAX_VALUE; - -- Number.MIN_VALUE; - -内置对象Boolean也有一些自带的方法,但是用的不多。 - -### 在底层,字符串以字符数组的形式保存 - -在底层,字符串是以字符数组的形式保存的。代码举例: - -```javascript - var str = "smyhvae"; - console.log(str.length); // 获取字符串的长度 - console.log(str[2]); // 获取字符串中的第2个字符 -``` - -上方代码中,`smyhvae`这个字符串在底层是以`["s", "m", "y", "h", "v", "a", "e"]`的形式保存的。因此,我们既可以获取字符串的长度,也可以获取指定索引index位置的单个字符。这很像数组中的操作。 - ## 内置对象 String 的常见方法 ### charAt() diff --git a/04-JavaScript基础/14-字符串的深入学习.md b/04-JavaScript基础/14-字符串的深入学习.md new file mode 100644 index 0000000..e69de29 diff --git a/04-JavaScript基础/14-数组简介.md b/04-JavaScript基础/15-数组简介.md similarity index 100% rename from 04-JavaScript基础/14-数组简介.md rename to 04-JavaScript基础/15-数组简介.md diff --git a/04-JavaScript基础/15-数组的常见方法&数组的遍历.md b/04-JavaScript基础/16-数组的常见方法&数组的遍历.md similarity index 98% rename from 04-JavaScript基础/15-数组的常见方法&数组的遍历.md rename to 04-JavaScript基础/16-数组的常见方法&数组的遍历.md index 0fa88e0..11d59c0 100644 --- a/04-JavaScript基础/15-数组的常见方法&数组的遍历.md +++ b/04-JavaScript基础/16-数组的常见方法&数组的遍历.md @@ -141,9 +141,9 @@ console.log(JSON.stringify(arr)); // 打印结果:["王二","王三"] ``` -## 数组的常见方法 +接下来,我们讲一下数组的其他常见方法。 -### slice() +## slice() `slice()`:从数组中**提取**指定的一个或者多个元素,返回结果为**新的数组**(不会改变原来的数组)。 @@ -200,7 +200,7 @@ ES6 看不下去这种蹩脚的转化方法,于是出了一个新的 API:( array = Array.from(arrayLike) ``` -### splice() +## splice() `splice()`:从数组中**删除**指定的一个或多个元素,返回结果为**新的数组**(会改变原来的数组)。 @@ -290,7 +290,7 @@ arr4:["a","千古壹号","vae","e","f"] result4:["b","c","d"] ``` -### concat() +## concat() `concat()`:连接两个或多个数组,返回结果为**新的数组**。(不会改变原数组) @@ -333,7 +333,7 @@ result2 =["a","b","c",1,2,3,"千古壹号","vae"] 从打印结果中可以看到,原数组并没有被修改。 -### join() +## join() `join()`:将数组转换为字符串,返回结果为**转换后的字符串**(不会改变原来的数组)。 @@ -371,7 +371,7 @@ result1 =a,b,c result2 =a-b-c ``` -### reverse() +## reverse() `reverse()`:反转数组,返回结果为**反转后的数组**(会改变原来的数组)。 @@ -582,7 +582,7 @@ qianguyihao 排序后的数组:[ -## 数组的遍历 +## 概念:数组的遍历 遍历数组即:获取并操作数组中的每一个元素。在我们的实战开发中,使用得非常频繁。 @@ -601,7 +601,7 @@ PS:这几个方法**不会修改原数组**。 有了这几种方法,就可以替代一些for循环了。下面依次来介绍。 -### for循环 遍历 +## for循环 遍历 举例: @@ -618,7 +618,7 @@ PS:这几个方法**不会修改原数组**。 ![](http://img.smyhvae.com/20180124_2008.png) -### forEach() 遍历 +## forEach() 遍历 > `forEach()` 这种遍历方法只支持IE8以上的浏览器。IE8及以下的浏览器均不支持该方法。所以如果需要兼容IE8,则不要使用forEach,改为使用for循环来遍历即可。 @@ -668,7 +668,7 @@ obj:王一,王二,王三 注意,forEach() 的返回值是 undefined。也就是说,它没有返回值。如果你尝试 `tempArry = arr.forEach()`这种方式来接收,是达不到效果的。 -### map()方法 +## map()方法 解释:对数组中每一项运行回调函数,返回该函数的结果,组成的新数组(返回的是**加工之后**的新数组)。 @@ -728,7 +728,7 @@ arr3:[{"myName":"千古壹号","myAge":"28"},{"myName":"许嵩","myAge":"32"}] map的应用场景,主要就是以上两种。 -### filter() +## filter() 解释:对数组中的**每一项**运行回调函数,该函数返回结果是true的项,将组成新的数组(返回值就是这个新的数组)。 @@ -783,7 +783,7 @@ map的应用场景,主要就是以上两种。 [{"name":"许嵩","type":"一线"},{"name":"邓紫棋","type":"一线"}] ``` -### every()方法 +## every()方法 `every()`:对数组中每一项运行回调函数,如果都返回true,every就返回true;如果有一项返回false,则停止遍历,此方法返回false。 @@ -811,7 +811,7 @@ map的应用场景,主要就是以上两种。 console.log(bool2); //输出结果:true。因为每个元素的长度都是两个字符。 ``` -### some()方法 +## some()方法 `some()`:对数组中每一项运行回调函数,只要有一项返回true,则停止遍历,此方法返回true。 @@ -860,9 +860,8 @@ map的应用场景,主要就是以上两种。 console.log('sumValue:' + sumValue); // 打印结果:18 ``` -## 数组的其他方法 -### indexOf() 和 lastIndexOf():获取数据的索引 +## indexOf() 和 lastIndexOf():获取数据的索引 **语法**: @@ -912,7 +911,7 @@ map的应用场景,主要就是以上两种。 ``` -### find() +## find() **语法**: @@ -936,7 +935,7 @@ map的应用场景,主要就是以上两种。 console.log(result); //打印结果:5 ``` -### findIndex() +## findIndex() **语法**: @@ -961,7 +960,7 @@ map的应用场景,主要就是以上两种。 ``` -### Array.from() +## Array.from() **语法**: @@ -1030,9 +1029,8 @@ array = Array.from(arrayLike) console.log(arr); ``` -## 其他 -### isArray():判断是否为数组 +## isArray():判断是否为数组 ```javascript 布尔值 = Array.isArray(被检测的值) ; @@ -1041,7 +1039,7 @@ array = Array.from(arrayLike) 以前,我们会通过 `A instanceof B`来判断 A 是否属于 B 类型。但是在数组里,这种 instanceof 方法已经用的不多了,因为有下面isArray()方法。 -### toString():转换数组 +## toString():转换数组 ```javascript 字符串 = 数组.toString(); @@ -1049,7 +1047,7 @@ array = Array.from(arrayLike) 解释:把数组转换成字符串,每一项用`,`分割。 -### valueOf():返回数组本身 +## valueOf():返回数组本身 ```javascript 数组本身 = 数组.valueOf(); diff --git a/04-JavaScript基础/16-函数.md b/04-JavaScript基础/17-函数.md similarity index 99% rename from 04-JavaScript基础/16-函数.md rename to 04-JavaScript基础/17-函数.md index ae46480..c1246d6 100644 --- a/04-JavaScript基础/16-函数.md +++ b/04-JavaScript基础/17-函数.md @@ -374,7 +374,7 @@ function sum(a, b) { } ``` -return 的作用是结束方法。 +return 的作用是结束方法(终止函数)。 注意: diff --git a/04-JavaScript基础/17-作用域和变量提升.md b/04-JavaScript基础/18-作用域和变量提升.md similarity index 100% rename from 04-JavaScript基础/17-作用域和变量提升.md rename to 04-JavaScript基础/18-作用域和变量提升.md diff --git a/04-JavaScript基础/18-预编译.md b/04-JavaScript基础/19-预编译.md similarity index 100% rename from 04-JavaScript基础/18-预编译.md rename to 04-JavaScript基础/19-预编译.md diff --git a/04-JavaScript基础/19-执行期上下文.md b/04-JavaScript基础/20-执行期上下文.md similarity index 100% rename from 04-JavaScript基础/19-执行期上下文.md rename to 04-JavaScript基础/20-执行期上下文.md diff --git a/04-JavaScript基础/20-this.md b/04-JavaScript基础/21-this.md similarity index 100% rename from 04-JavaScript基础/20-this.md rename to 04-JavaScript基础/21-this.md diff --git a/04-JavaScript基础/21-对象的创建&构造函数.md b/04-JavaScript基础/22-对象的创建&构造函数.md similarity index 100% rename from 04-JavaScript基础/21-对象的创建&构造函数.md rename to 04-JavaScript基础/22-对象的创建&构造函数.md diff --git a/04-JavaScript基础/23-包装类.md b/04-JavaScript基础/23-包装类.md deleted file mode 100644 index acd223b..0000000 --- a/04-JavaScript基础/23-包装类.md +++ /dev/null @@ -1,91 +0,0 @@ - -## 包装类 - -### 包装类的介绍 - -我们都知道,js中的数据类型包括以下几种。 - -- 基本数据类型:String、Number、Boolean、Null、Undefined - -- 引用数据类型:Object - -JS为我们提供了**三个包装类**: - -- String():将基本数据类型字符串,转换为String对象。 - -- Number():将基本数据类型的数字,转换为Number对象。 - -- Boolean():将基本数据类型的布尔值,转换为Boolean对象。 - -通过上面这这三个包装类,我们可以**将基本数据类型的数据转换为对象**。 - - -代码举例: - -```javascript - var num = new Number(3); - - var str = new String("hello"); - - var bool = new Boolean(true); - - console.log(typeof num); // 打印结果:object -``` - - -**需要注意的是**:我们在实际应用中不会使用基本数据类型的对象。如果使用基本数据类型的对象,在做一些比较时可能会带来一些**不可预期**的结果。 - -比如说: - -```javascript - var boo1 = new Boolean(true); - var boo2 = new Boolean(true); - - console.log(boo1 === boo2); // 打印结果竟然是:false -``` - - -再比如说: - -```javascript -var boo3 = new Boolean(false); - -if (boo3) { - console.log('qianguyihao'); // 这行代码竟然执行了 -} -``` - - -### 基本数据类型不能添加属性和方法 - -方法和属性只能添加给对象,不能添加给基本数据类型。 - -**注意**:当我们对一些基本数据类型的值去调用属性和方法时,浏览器会**临时使用包装类将其转换为对象**,然后在调用对象的属性和方法;调用完以后,在将其转换为基本数据类型。 - -代码举例: - -```javascript - var str = 123; - - str = str.toString(); // 将 number 类型转换为 string 类型 - str.hello = "千古壹号"; // 添加属性 - - console.log(typeof str); // 打印结果:string - console.log(str.hello); // 打印结果:undefined -``` - -再比如,String 对象的很多内置方法,也可以直接给字符串用。此时,也是临时将字符串转换为 String 对象,然后再调用内置方法。 - - - -## 我的公众号 - -想学习**代码之外的技能**?不妨关注我的微信公众号:**千古壹号**(id:`qianguyihao`)。 - -扫一扫,你将发现另一个全新的世界,而这将是一场美丽的意外: - -![](http://img.smyhvae.com/20190101.png) - - - - diff --git a/04-JavaScript基础/22-对象的基本操作.md b/04-JavaScript基础/23-对象的基本操作.md similarity index 100% rename from 04-JavaScript基础/22-对象的基本操作.md rename to 04-JavaScript基础/23-对象的基本操作.md