-
JS基本数据类型及变量声明
- 在js中有三种声明变量的方式：
varletconst,letvarconst的区别？var
由于变量声明（以及其他声明）总是在任意代码执行之前处理的，所以在代码中的任意位置声明变量总是等效于在代码开头声明。a = 2 var a; // ... // 可以理解为： var a；//声明一个变量，且这个变量为undefined. a=2；//给声明的变量a赋值，由于这个原因，我们建议总是在作用域的最开 始（函数或者全局代码的开头）声明变 量。这样可以使变量的作用域变得清 晰。let
let作用域：只在let命令所在的代码块内有效。//let声明 的变量只在它所在的代码块有效。 {let a=3;} console.log(a);//VM11918:1 Uncaught ReferenceError: a is not defined //计数器i只在for循环体内有效，在循环体外引用就会报错 for (let i = 0; i < 3; i++) {} console.log(i);//VM13498:1 Uncaught ReferenceError: i is not defined //for循环还有一个特别之处，就是循环语句部分是一个父作用域，而循环体 内部 是一个单独的子作用域。 for (let i = 0; i < 3; i++) { let i = 'abc'; console.log(i); }const
1、const声明一个只读的常量。一旦声明，常量的值就不能改变。
2、const PI = 3.1415;//不报错 PI=3;//VM33690:1 Uncaught TypeError: Assignment to constant variable.const声明的变量不得改变值，这意味着，const一旦声明变量，就必须立即初始化，不能留到以后赋值。const foo;//VM35236:1 Uncaught SyntaxError: Missing initializer in const declaration - 基本类型
js有6种数据类型,包括五种基本数据类(Number,String,Boolean,Undefined,Null),和一种复杂数据类型(Object)。1.Number类型 Number类型包含整数和浮点数（浮点数数值必须包含一个小数点，且小数点后面至少有一位数字）两种值。 NaN:非数字类型。特点：① 涉及到的 任何关于NaN的操作，都会返回NaN ② NaN不等于自身。 isNaN() 函数用于检查其参数是否是非数字值。 isNaN(123) //false isNaN("hello") //true 2.String类型 字符串有length属性。 字符串转换：转型函数String(),适用于任何数据类型（null,undefined 转换后为null和undefined）；toString()方法（null,defined没有toString()方法）。 3.Boolean类型 该类型只有两个值，true和false 4.Undefined类型 只有一个值，即undefined值。使用var声明了变量，但未给变量初始化值，那么这个变量的值就是undefined。 5.Null类型 null类型被看做空对象指针，前文说到null类型也是空的对象引用。 6.Object类型 js中对象是一组属性与方法的集合。这里就要说到引用类型了，引用类型是一种数据结构，用于将数据和功能组织在一起。引用类型有时候也被称为对象定义，因为它们描述的是一类对象所具有的属性和方法。
- 在js中有三种声明变量的方式：
-
类型转换
转Boolean!!'' //=> false !!null //=> false !!undefined //=> false !!NaN //=> false !!0 //=> false !!1 //=> true !!-1 //=> true !![] //=> true !!{} //=> true !!window //=> true !!Infinity //=> true转
String''+hello//=>'hello' ''+true//=>'true'转
Number+new Date //=> 1456480246437 +'123' //=> 123向下取整
~~3.4 //=> 3 3.4|0 //=> 3 -3.4^0 //=> -3 -3.4 >> 0 //=> -3类数组转数组
var arrLike = {0:'abc',1:'xyz',length:2}; Array.prototype.slice.call(arrLike) //=> ['abc','xyz'] //常用 Array.prototype.slice.call(arguments) -
类型检测
typeof操作符，由于js中的变量是松散类型的，所以它提供了一种检测当前变量的数据类型的方法，也就是typeof关键字.typeof 123 //Number typeof 'abc' //String typeof true //Boolean typeof undefined //Undefined typeof null //Object typeof { } //Object typeof [ ] //Object typeof console.log() //Function null类型进行typeof操作符后，结果是object，原因在于，null类型被当做一个 空对象引用。 -
比较运算符
比较运算符在逻辑语句中使用，以测定变量或值是否相等。
1.给定 x=5，下面的表格解释了比较运算符：运算符 描述 例子 == 等于 x==8 为 false；x==5 为 true； === 全等于(值和类型) x===5 为 false；x==='5' 为 false； != 不等于 x!=8 为 true > 大于 x>8 为 false < 小于 x<8 为 true >= 大于或等于 x>=8 为 false <= 小于或等于 x<=8 为 true 2.如何使用
可以在条件语句中使用比较运算符对值进行比较，然后根据结果来采取行动：var age=16; if(age<18){ alert('还很年轻') }else{ alert("你懂的") } -
字符串操作
-
字符串拼接
//如果将加号(+)运算符用于数字，表示两数相加。 //但将它作用于字符串，则表示字符串连接，将第二个字符串拼接在第一个字符串之后，如下 msg="hello,"+"world"; console.log(msg);//生成字符串"hello,world"; -
字符串裁剪
JavaScript字符串方法有很多，其中有三个方法与字符串裁剪有关，他们分别是slice()、substring()和substr()，我把他们统称为“三剑客”。一、共同点
① 接受一个或两个参数，其中第一个参数为裁剪的开始位置
② 都会返回被裁剪下来的子字符串，而原字符串不受影响
③ 若不传第二个参数，则从开始位置（第一个参数）一直截取到字符串结尾。var str = '高德地图持续为你导航'; var str1 = str.slice(2); console.log(str1); // "地图持续为你导航" str1 = str.substring(2); console.log(str1); // "地图持续为你导航" str1 = str.substr(2); console.log(str1); // "地图持续为你导航" console.log(str); // "高德地图持续为你导航"可以看出，当只传入一个参数时，这三个方法的用法和作用都是一致的，都是将“地”字（索引值为2）一直到字符串末尾的字符串裁剪下来并返回，并且都不会影响到原字符串
二、区别
①
slice()和substring()的第二个参数均表示的是裁剪的结束位置（但不包括 该项，这与数组中的slice()方法类似），而substr()的第二个参数则表示的是裁剪下来字符串长度
② 当传入的参数为负值时，slice()会将所有负参数与字符串的长度相加，substring()会把所有负参数都转换为0，而substr()就相对比较复杂了，它会将第一个负参数加上字符串长度，第二个参数转换为01.参数为正数
var str = '高德地图持续为你导航'; var str1 = str.slice(2,4); console.log(str1); // "地图 str1 = str.substring(2,4); console.log(str1); // "地图" str1 = str.substr(2,4); console.log(str1); // "地图持续"很明显，
slice()和substring()用法一致，两个参数分别都表示的是起始位置2和结束位置4，不包含结束位置4所在字符（“持”），而substr()第二个参数表示的是要裁剪下来的字符串长度，实例中是裁剪4个字符。2.参数为负数
var str = '高德地图持续为你导航'; console.log(str.length); // 10 var str1 = str.slice(-4); // 相当于str.slice(6) console.log(str1); // "为你导航" str1 = str.substring(-4); // 相当于str.substring(0) console.log(str1); // "高德地图持续为你导航" str1 = str.substr(-4); // 相当于str.substr(6) console.log(str1); // "为你导航" var str2 = str.slice(2,-4); // 相当于str.slice(2,6) console.log(str2); // "地图持续" str2 = str.substring(2,-4); // 相当于str.substring(2,0)，也就是 str.substring(0,2) console.log(str2); // "高德" str2 = str.substr(2,-4); // 相当于str.substr(2,0) console.log(str2); // "" var str3 = str.slice(-2,-4); // 相当于str.slice(8,6) console.log(str3); // "" str3 = str.substring(-2,-4); // 相当于str.substring(0,0) console.log(str3); // "" str3 = str.substr(-2,-4); // 相当于str.substr(8,0) console.log(str3); // "" var str4 = str.slice(-4,-2); // 相当于str.slice(6,8) console.log(str4); // "为你" str4 = str.substring(-4,-2); // 相当于str.substring(0,0) console.log(str4); // "" str4 = str.substr(-4,-2); // 相当于str.substr(6,0) console.log(str4); // ""当参数为负数时，只需牢记，
slice()见负加总长，substring()见负则归零，substr()一加总长一归零。 另外还需要特别注意的一点是，slice()第一个参数须小于第二个参数才能正常截取字符串，否则返回的是空字符串，而substring()则没有这个问题。 -
字符串分割
说完字符串的裁剪，这次来说说字符串的分割。
你可能会有所疑惑，裁剪和分割，这两者到底有什么区别呢？裁剪： 一次裁剪一部分子字符串并返回，可使用slice()、substring()和substr()方法实现
分割： 一次可将字符串分割成多个子字符串并返回由这些子字符串组成的数组，可使用split()实现首先，我们先定义一个字符串：
var str='Hello World!'1、只传一个参数，传入字符串或正则
console.log(str.split('l')); // [ "He","","o Wor","d!" ] console.log(str.split('')); // [ "H","e","l","l","o","","W","o","r","l","d","!" ] console.log(str.split(/l+/)); // [ "He","o Wor","d!" ]2、传入两个参数
第一个参数还是一样，字符串或正则，而第二个参数则是一个数字，用于指定返回数组的大小。例如：console.log(str.split('',5)); // [ "H","e","l","l","o" ]这实际就是在
str.split('')的基础上又截取了输出数组的前5项，与下面两种方式的运行结果是一样的：console.log(str.slice(0,5).split('')); // [ "H","e","l","l","o" ] console.log(str.split('').slice(0,5)); // [ "H","e","l","l","o" ]这两种方式，一个是先裁后分，另一个则是先分后裁，最终结果都是一样的。而给
split()方法传入第二个参数则相当于是个简化版，效果其实是一样的。
3、逆操作方法
说完了split()的用法，再顺便提一提该方法的逆操作方法——join()。split(): 将字符串分割成数组
join(): 将数组合并成字符串-
不传参数
console.log(str.split('',5).join()); // "H,e,l,l,o"默认使用逗号来连接数组的每一项而组成字符串并返回。
-
传入空字符串
console.log(str.split('',5).join('')); // "Hello"直接将数组中的每一项连接起来组成字符串并返回。
-
传入非空字符串
console.log(str.split('',5).join('|')); // "H|e|l|l|o"使用所传字符串参数来连接数组的每一项而组成字符串并返回。
-
-
-
字符串替换
var str="Hello World"; str=str.replace('World','Curry'); console.log(str);//"Hello Curry" str=str.replace(/hello/i,'Hi'); console.log(str);//"Hi Curry" -
字符串查询
1、testRegExpObject.test(string)
test()方法是正则对象的一个方法，用于是否匹配某个模式，返回true或falsevar str='javascript'; var reg=/java/;//正则表达式 reg.test(str);//true2、exec
RegExpObject.exec(string)
在循环中反复地调用 exec() 方法是唯一一种获得全局模式的完整模式匹配信息的方法。var str='javascript java'; var reg=/java/;//正则表达式 reg.exec(str);//返回["java", index: 0, input: "javascript java", groups: undefined] var str1='高德地图持续为你导航'; var reg1=/百度/; reg1.exec(str1);//返回null3、search
stringObject.search(regexp)
用于检索字符串中指定的子字符串，或检索 与正则表达式相匹配的子字符串。返回第一个与regexp相匹配的子串的起始位置,如果要执行忽略大小写的检索，追加标志i
var a="Jianshu markdown bu zhi chi table Markdown"; a.search('jianshu'); //-1 a.search('Jianshu'); //0 a.search('markdown'); //8 a.search(/\bmarkdown\b/) ; //8 a.search(/JIanShu/i) //0 使用search做忽略大小写的匹配呢，就是在后面加i4、match
stringObject.match(regexp)
var b='Markdown markdown markdown'; b.match(/markdown/ig) //["Markdown", "markdown", "markdown"] b.match(/markdown/i) //["Markdown"] b.match('markdown') //["markdown"] 这里发生了一次隐式转换 b.match('markdown/i') //null 因为是直接吧markdown/i整个字符串进行RegExp构建的 var c=b.match(/markdown/) console.log(c); //["markdown", index: 9, input: "Markdown markdown markdown"] //尝试设置lastIndex改变匹配起始处 var b='Markdown markdown markdown'; var temp=new RegExp(/markdown/); temp.lastIndex=18; var c=b.match(temp); console.log(c) //["markdown", index: 9, input: "Markdown markdown markdown"]5、includes
includes()方法用于 判断一个字符串是否被包含在另一个字符串中，如果是返回true，否则返回false。该方法区分大小写
兼容性：ECMA6，chrome 41+、firefox 40+，safari 9+；ie全系不支持stringObject.includes(searchString [, position])
var str = 'To be, or not to be, that is the question.'; console.log(str.includes('To be')); // true console.log(str.includes('question')); // true console.log(str.includes('nonexistent')); // false console.log(str.includes('To be', 1)); // false console.log(str.includes('TO BE')); // false -
数组操作
-
数组创建
var arr1=[1,2,3,4,5,6];//声明一个数组 console.log(arr1);//输出[1,2,3,4,5,6] var arr2=new Array(); console.log(arr2);//输出[] arr2[2]=1; console.log(arr2);//输出[, , 1] -
数组长度及索引
- 数组长度
var arr=[1,2,3]; console.log(arr.length);//输出3 - 数组索引
var arr=[1,2,3]; console.log(arr[0]);//输出1 console.log(arr[1]);//输出2 console.log(arr[2]);//输出3 arr[5]=1;//通过索引修改数组的长度 console.log(arr); //输出[1,2,3,,,1]; console.log(arr.length);//输出6
- 数组长度
-
数组中值的添加和删除
我们可以使用数组对象中的内置方法对数组中的值进行添加和删除，常用的有如下四种方法：(pop、push、shift、unshift、splice)；-
pop()
pop()方法用于删除数组中的最后一位值，并返回这个值，使用方法如下：var arr=[1,2,3,4,5]; arr.pop();//返回5 console.log(arr);//[1,2,3,4] -
push()
push()方法用于添加一个值到数组的最后一位，参数填写需要添加进去的值，执行后返回添加后数组的长度：var arr=[1,2,3]; arr.push(6);//返回数组长度4 console.log(arr);//[1,2,3,6] -
shift()
shift()方法用于删除数组中的第一位值，并返回这个值：var arr=[1,2,3,4,5]; arr.shift();//返回1 console.log(arr);//[2,3,4,5] -
unshift()
unshift()方法用于添加一个值到数组的第一位，然后返回添加后的数组长度，参数为需要被添加进去的值：var arr=[1,2,3,4,5]; arr.unshift(0);//返回数组长度6 console.log(arr);//[001,2,3,4,5] -
splice()
然而上面四种操作都不是很方便，比如需要对数组中间的值进行删除和添加它们就无能为力了，这时候我们可以使用数组对象内置的方法splice()；
splice功能非常强大，它可以接受两个、三个或多个参数，它的第一个参数代表需要操作的值的索引，第二个参数是需要删除的值的个数，第三个参数可以是多个参数，代表需要添加进去的值，下面来看一下使用例子：var arr=[1,2,3,4,5]; //删除数组中的3 arr.splice(2,1);//返回[3] console.log(arr);//返回[1,2,4,5] //添加100到4的前面 arr.splice(2,0,100); console.log(arr);//返回[1,2,100,4,5] //添加很多个100到4的前面 arr.splice(3,0,100,100,100,100); console.log(arr);//返回[1,2,100,100,100,100,100,4,5]
-
-
数组排序
我们可以使用reverse()、sort()对数组进行排序- reverse()
reverse()方法可以将数组反转，逆向排序，这个方法会对原数组产生影响，使用如下：var a=[1,2,3,4,5]; a.reverse();//返回[5,4,3,2,1] console.log(arr);//[5,4,3,2,1] - sort()
sort()方法功能更加强大，它可以按照我们想要的方式对数组进行排序，无参数时按照ASCII码的大小进行排序，此外它可以接收一个回调函数作为参数，然后按照该函数返回的值对数组进行排序，这个方法也会对原数组产生影响
1.无参数时，按照值的第一位的ASCII码进行排序：
2.传入回调函数，该函数返回的是正数的话，则按照从小到大的顺序排序：var arr=[,56,23,34,78]; arr.sort();//[23, 34, 56, 78] console.log(arr);//[23, 34, 56, 78]
返回的如果是负数，则按照从大到小的顺序排序：var arr=[,56,23,34,78]; arr.sort(function(a,b){return a-b});//[23,34,56,78] arr.sort(function(a,b){return b-a});//[78,56,34,23]
- reverse()
-
数组的分割和组合
除了上面的对数组中的值进行添加和删除的五种操作方法外，数组对象还内置了对数组进行分割和组合的方法- concat()
concat()方法用于将两个数组结合成一个数组，参数为需要结合的数组，该方法不会对原数组产生影响，返回的是一个新的数组，生成的新数组一般通过赋值进行使用，用法如下var a=[1,2,3,4,5]; var b=[6,7,8,9]; var c=a.concat(b); console.log(c);//[1, 2, 3, 4, 5, 6, 7, 8, 9] - slice()
slice()方法用于分割数组，它接受两个参数，第一个是分割的起始索引（包括该值），第二个是结束索引（分割不包括该值），参数允许负数，该方法不会影响原数组，而是返回一个新的数组：var a=[1,2,3,4,5]; a.slice(0,2);//返回[1,2] console.log(a);//[1,2,3,4,5]
- concat()
-
数组转化为字符串(join()方法)
数组可以通过join()方法将数组转化为字符串：
join()方法可以传入一个参数，用作分隔转化后的字符串的参照物，该参数可以是空字符串，没有参数则默认使用逗号进行分隔，这个方法不会对原数组产生影响：- 1.无参转化
var a=[1,2,3,4,5]; a.join();//返回"1,2,3,4,5" - 2.有参转化：
var a=[1,2,3,4,5]; a.join('');//返回"12345"
- 1.无参转化
-
数组遍历
常见的方法有for循环、forEach、map、for ..... in、for ... of-
for循环
var arr=["Curry","Kobe","James","Durant"]; for(var i=0;i<arr.length;i++){ console.log(arr[i]) } //依次输出 Curry Kobe James Durant -
for… in
var arr=["Curry","Kobe","James","Durant"]; for(var i in arr){ console.log(arr[i]+'/'+i) } //依次输出 Curry/0 Kobe/1 James/2 Durant/3 -
for…of
var arr=["Curry","Kobe","James","Durant"]; for(var item of arr){ console.log(item) } //依次输出 Curry Kobe James Durant -
forEach方法：被传递给foreach的函数会在数组的每个元素上执行一次，元素作为参数传递给该函数
var arr=["Curry","Kobe","James","Durant"]; arr.forEach(function(element,index){ console.log(element+"/"+index) }) //依次输出 Curry/0 Kobe/1 James/2 Durant/3 -
map 遍历数组，并通过callback对数组元素进行操作，并将所有操作结果放入数组中并返回该数组
var arr=["Curry","Kobe","James","Durant"]; var arr1=arr.map(function(item){ return item.toUpperCase(); }) console.log(arr1) // ["CURRY", "KOBE", "JAMES", "DURANT"] -
filter( )返回一个包含所有在回调函数上返回为true的元素新数组，回调函数在此担任的是过滤器的角色，当元素符和条件，过滤器就返回true,而filter则会返回所有符合过滤条件的元素
var arr=["Curry","Kobe","James","Durant",30,24,23,35]; var arr2=arr.filter(function(item){ if(typeof item=="number"){ return item; } }) console.log(arr2) // [30, 24, 23, 35] -
every() 当数组中的每一个元素在callback上被返回true时就返回true(注意：要求每一个单元项都返回true时才为true)
var arr=["Curry","Kobe","James","Durant",30,24,23,35]; var arr3=arr.every(function(item){ if(typeof item=="string"){ return item; } }) console.log(arr3) // false -
some()只要数组中有一项在callback上就返回true
var arr=["Curry","Kobe","James","Durant",30,24,23,35]; var arr4=arr.some(function(item){ if(typeof item=="string"){ return item; } }) console.log(arr4) // true
-
-
