内置对象
系统内置的构造函数（类）
1 Number
属性
-
Nnumber.MAX_VALUE
-
Number.MIN_VALUE
方法
-
toFixed([number]) 取整或者保留指定位数的小数 （四舍五入）
-
toString([number]) 转为字符串形式，可以指定进制
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Number对象</title> </head> <body> <script> var n1 = 100; var n2 = new Number(100); console.log(n1); //100 console.log(n2); //Number console.log(n1 == n2); //true console.log(n1 === n2); //false console.log(n2 + 100); //200 console.log(n1.constructor); //ƒ Number() { [native code] } //类的属性 console.log(Number.MAX_VALUE); //可以表示最大的值-------1.7976931348623157e+308 console.log(Number.MIN_VALUE); //可以表示最小值----------5e-324 console.log(n1.toString()); //变成字符串100 console.log(typeof n1.toString()); //变成字符串100----string console.log(n1.toString(2)); //二进制输出-------------1100100 console.log(n1.toString(8)); //8进制输出--------------144 console.log(n1.toString(16)); //16进制输出------------64 console.log(n1.toString(3)); //3进制输出--------------10201 //取整数 console.log(n1.toFixed()) //100 console.log(10.354.toFixed()) //四舍五入取整----------10 console.log(10.67.toFixed()) //---------------------11 console.log(10.354.toFixed(1)) //四舍五入取整---------10.4 console.log(10.354.toFixed(8)) //四舍五入取整---------10.35400000 </script> </body> </html>
2 String
属性
-
length 字符串长度
方法
indexOf() 返回第一次出现的位置 不存在 返回-1
lastIndexOf() 返回最后一次出现的位置 不存在 返回-1
substr(start, lenth) 截取 开始和截取长度
substring(start, end) 截取 开始和结束位置
slice(start,end) 同上
split() 把字符串分割成 数组
trim() 去掉两边的空格
toUpperCase() 转大写
toLowerCase() 转小写
replace(旧, 新) 替换 只能替换一次
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>字符串</title> </head> <body> <h1>字符串</h1> <hr> <script> var message = 'i love you hello 你'; console.log(message.length); //字符的个数------------18 console.log(message[3]); //通过索引取字符串中指定的字符----o //方法 console.log(message.charAt(5)); //返回指定位置的字符------e console.log(message.indexOf('o')); //返回指定的字符串(字符串) 第一次出现的位置--------------3 console.log(message.indexOf('love')); //返回指定的字符串(字符串) 第一次出现的位置-----------2 console.log(message.lastIndexOf('o')); //返回指定的字符串(字符串) 最后一次出现的位置--------15 console.log(message.substr(3)); //截取字符串中子字符串，从索引为3的字符串开始到最后---------ove you hello 你 console.log(message.substr(4, 5)); //截取 从第4开始截取5个字符----------------------------ve yo console.log(message.substring(4)) //同substr-------------------------------------------ve you hello 你 console.log(message.substring(4,6)); //从第4个到第6个（不包含第6个）------顾头不顾尾----ve console.log(message.slice(4,6));//同上--------------------------------------------------ve //把字符串分隔成 数组 console.log(message.split(' ')); // ["i", "love", "you", "hello", "你"] console.log(message.toUpperCase()) //I LOVE YOU HELLO 你 console.log(message.toLowerCase()) //i love you hello 你 console.log(message.replace('o', '偶')); //i l偶ve you hello 你------只会替换从左到右数第一个字符串中的o console.log(message.replace(/o/g, '偶')); //i l偶ve y偶u hell偶 你----使用正则可以替换字符串中所有的o console.log(message.trim()); //i love you hello 你------去掉字符串两边的空格，同Python中strip console.log(message.indexOf('哈哈哈')); //返回指定的字符串(字符串) 第一次出现的位置-----，没有返回-1，利用这个特性可以判断一个字符是否属于一个字符串 </script> </body> </html>
3 Boolean
false/true
4 Array
4.1 创建数组
var list = [item1, item2, item3 ...]
var list = new Array()
3.2 数组操作
#添加元素
list.push() 最后面
list.unshift() 最前面
list.splice(位置,0,新值) 指定位置
#删除元素
list.pop() 删除最后 返回删除的元素
list.shift() 删除第一个 返回删除的元素
list.splice(位置,删除的个数) 指定位置删除指定个数
#设置修改
list[index] = value
list.splice(位置，删除个数,值1,值2...)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>数组</title> </head> <body> <h1>数组</h1> <hr> <script> //重点理解splice var list = [100,23,'hello', 9, [1,2,3], {name:'lili',age:10}]; console.log(list); //[100, 23, "hello", 9, Array(3), {…}] 显示不下可以打开有箭头查看全部内容 // list[18] = 1000; //console.log(list); //稀疏数组 ， 尽量避免。 数组的索引必须连续 console.log(list.length); //统计数组的长度：6 //如何给数组添加元素 //在最后面追加-----------改变的是原数组 list.push(1314); //在最前面追加 list.unshift(520) //指定位置追加 list.splice(3,0,'小丽丽','大丽丽') //在指定的索引后面可以添加一个或多个字符，如果未规定此参数，则删除从 index 开始到原数组结尾的所有元素。 console.log(list); console.log(''); //删除数组的元素 //删除最后一个 list.pop(); // 删除第一个 list.shift(); //删除指定位置 list.splice(4,2) //指定删除元素的位置和删除的元素个数 console.log(list); //修改数组中的元素 list[2] = '老丽丽'; //通过数组的索引修改指定的字符 list.splice(2, 2, '小芳','小芳她妹','小芳她姐') //指定索引，指定修改字符的个数，可以替换为任意多个字符 console.log(list); </script> </body> </html>
3.3 属性和方法
属性
length
方法
push()
pop()
shift()
unshift()
splice()
sort()
reverse()
------------------------
join()
concat() 数组连接
slice()
indexOf()
lastIndexOf()
map()
filter()
some()
every()
reduce()
forEach()
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>数组的方法</title> </head> <body> <script> var list = [1,2,31,4,5,6,10]; console.log(list) list.reverse(); //将数组整体进行翻转------------ [10, 6, 5, 4, 31, 2, 1] // list.sort(function(v1, v2) { // //返回正数 替换。 返回负数，不变 // return v1 - v2; // }); console.log(list) str = list.join(','); //拼成字符串,将数组通过指定的分隔符拼接成字符串 console.log(str) console.log(list.concat([1,2,3], ['a','b','c'])) //将多个数组拼接成一个数组-----[10, 6, 5, 4, 31, 2, 1, 1, 2, 3, "a", "b", "c"] console.log(list.slice(1,5)); //截取，类似Python中的切分，指定截取的索引起点和终点，但是顾头不顾尾------[6, 5, 4, 31] console.log(list.indexOf(31)); //判断指定索引在数组中的索引位置-----------------------------------4 console.log(list.lastIndexOf(301)); //判断数组中是否存在某个值，不存在返回的是：-1 console.log(''); // map会将数组进行遍历，将数组中的每一个值加上100 list=[1,2,3,4,5,6,7,8] var arr = list.map(function(value, index) { // console.log(value, index) //会打印出数组所有的值和对应的索引 return value + 100; }) console.log(arr); // [101, 102, 103, 104, 105, 106, 107, 108] // filter对数组进行过滤，过滤出符合条件的数组 list=[1,2,3,4,5,6,7,8] var arr = list.filter(function(value, index){ //console.log(value, index) //return false; // 过滤条件 if (value > 6) { return true } else { return false } }); console.log(arr); //[7, 8] // //返回布尔值 // every判断数组中的每一个值是否符合我们设定的条件，全部符合才返回true list=[1,2,3,4,5,6,7,8] var res = list.every(function(value, index){ return value >= 1; }); console.log(res); //布尔值------true // //some 返回布尔值 数组成员只要至少有一个满足条件 就返回true list=[1,2,3,4,5,6,7,8] var res = list.some(function(value, index) { return value > 6; }); console.log(res); // //reduce 返回值 // //阶乘 list=[1,2,3,4,5,6,7,8] var res = list.reduce(function(prev,value,index){ return prev * value; //将数组中的每一个值进行相乘----等同于---- console.log(1*2*3*4*5*6*7*8) ，index也可以省略不写 }); console.log(res) </script> </body> </html>
3.4 数组的遍历（迭代）
#for 循环和
for (var i = 0; i < arr.length; i ++) {
arr[i]
}
#for .. in
for (var i in arr) {
arr[i]
}
#推荐 数组方法 forEach
arr.forEach(function(val, index){
})
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>遍历数组</title> </head> <body> <script> var arr = [10,20,30,40,50,60]; console.log(arr); //方式一：for循环遍历 for (var i = 0; i < arr.length; i ++) { console.log(arr[i]) //遍历的结果是：换行输出数组中的每一个值 } console.log(''); //方式二：不牛逼的for in----------结果同上for循环的遍历结果 // 强调for in 循环的结果是数组中的索引 for (var i in arr) { console.log(arr[i]) } console.log(''); //方式三：forEach--------推荐使用，遍历取出数组中的每一个值 arr.forEach(function(value, index){ console.log(index+' => '+value) }) </script> </body> </html>
5 类数组对象
-
类型不是Array，特性非常像Arrat
-
具有length属性
-
常见类数组对象： arguments， 元素的列表(NodeList)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>类数组对象</title> </head> <body> <div class="item">1</div> <div class="item">2</div> <div class="item">3</div> <div class="item">4</div> <div class="item">5</div> <script> //for ... of var list = [1,2,3,4,5]; //纯的 var itemList = document.querySelectorAll('.item'); //获取CSS元素，减前面知识点,获取的元素是一个数组的形式 console.log(list); // [1, 2, 3, 4, 5] console.log(itemList); //NodeList(5) [div.item, div.item, div.item, div.item, div.item] console.log(list.constructor); //查看数组的构造函数： Array() { [native code] } console.log(itemList.constructor); //查看获取元素的构造函数： NodeList() { [native code] } function demo(){ console.log(arguments.constructor) //查看arguments的构造函数： ƒ Object() { [native code] } } demo(); console.log(itemList[0]) //通过索引查看获取元素的一个元素：<div class="item">1</div> console.log(itemList.length); //获取元素数组对象的长度是：5 // 遍历获取的元素的三种方法： // 方法一：for循环遍历 for (var i = 0; i < itemList.length; i ++) { console.log(itemList[i]) //通过for循环，得到获取的所有元素 } console.log(''); // 方法二：for in循环 for (var i in itemList) { console.log(i, itemList[i]) //通过for in循环获取所有的索引的值，以及索引对应的元素值 } // 方法三：forEach itemList.forEach(function(value, index) { console.log(value) }) </script> </body> </html>
6 Function
# 属性
length 形参的长度
# 方法
call(对象，参数,参数2...) 在调用函数（方法）的同时，改变函数内this的指向
apply(对象, 数组) 在调用函数（方法）的同时，改变函数内this的指向
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>函数对象</title> </head> <body> <script> window.name = 'sb'; //demo全局变量， 全局变量属于全局对象（global）->window //this表示 方法所属的对象 function demo(a,b,c) { console.log('啊，我被调用了'); console.log(this); //Window {postMessage: ƒ, blur: ƒ, focus: ƒ, close: ƒ, frames: Window, …} console.log(this.name); //sb console.log(a,b,c); //1 2 3 console.log('') } console.log(demo.constructor); //查看函数的构造函数：ƒ Function() { [native code] } console.log(demo.length);//形参的个数：3 demo(1,2,3); //调用的 window.demo(1,2,3); demo.apply() //apply其实就是调用函数，相当于demo() // //apply 调用函数，改变函数内的this的指向 demo.apply({name:'lili'}, [10,'hello',30]); //大括号中是this指向的对象，中括号是出入的参数 demo.call({name:'xiaofang'}, 10, 20, 40); //大括号中是this指向的对象，后面是出入的参数，不用中括号 // call改变this指向的应用： // push是数组的方法,在数组的最后追加一个值 console.log(''); var obj = {}; //对象 [].push.call(obj, 300) //使用call可以使，没有push方法的对象obj ,也可以通过push向对象中添加属性的值 console.log(obj); //{0: 300, length: 1} console.log('') function fn() { //遍历所有的实参 // this此时指向arguments对象，传入的参数是一个匿名函数，这样就可以使得没有forEach方法的arguments也可以通过forEach方法进行出入参数 [].forEach.call(arguments, function(val, index){ console.log(val) }) } fn(1,2,3,5,6,7,'hello'); </script> </body> </html>
7 Math 数学
属性
Math.PI
方法
Math.abs() 绝对值
Math.pow() 求几次方
Math.max() 最大值
Math.min() 最小值
Math.ceil() 进位取整
Math.floor() 舍位取整
Math.round() 四舍五入
Math.random() 随机数 0~1 0有可能，1不可能
取随机数
0~9
Math.floor(Math.random() * 10)
6~13
Math.floor(Math.random() * 8) + 6
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Math</title> </head> <body> <script> //记住即可 //Math 对象 console.log(Math); //Math console.log(typeof Math); //object console.log(Math.constructor); //ƒ Object() { [native code] } console.log(Math.PI); //圆周率--------------3.141592653589793 console.log(Math.abs(-78)) //绝对值---------78 console.log(Math.abs(89.9)) //89.9 console.log(Math.pow(3,4)) //3的4次方-------81 console.log(Math.ceil(12.0001)); //取整数，进位取整 往大了取-----------13 console.log(Math.floor(12.9998)); //取整数，舍位取整 往下了取---------12 console.log(Math.round(3.47)); //取整 四舍五入------------------------3 console.log(Math.max(10,20,1,45,3)); //可变参数数量 取最大值----------45 console.log(Math.min(10,20,1,45,3)); //可变参数数量 取最小值----------1 //取随机数 console.log(Math.random()); //0到1之间 0可能会被取到 1不可能-----------0.06254222105778706 //取 0到10之间的随机数 console.log( Math.floor(Math.random() * 11)); //0到11 console.log( Math.round(Math.random() * 11)); //0到28 console.log(Math.floor(Math.random() * 29)); //7-17随机数 //取0~10 + 7 console.log(Math.floor(Math.random() * 11) + 7); </script> </body> </html>
8 Date
getFullYear() 公元纪年
getMonth() 月份 0~11 需要+1
getDate() 日期
getDay() 星期几
getHours() 时
getMinutes() 分
getSeconds() 秒
getMilliseconds() 毫秒
getUTC... 标准时区的时间
set...
setUTC...
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Date日期</title> </head> <body> <script> // 记住即可 //获取日期对象 var date = new Date(); date.setFullYear(1978); //设置年 date.setUTCHours(3); //设置当前小时比世界标准时间超前两个小时 console.log(date); //Sun Aug 13 1978 09:38:21 GMT+0800 (中国标准时间) ------我们也可以根据需求自己拼接时间的格式 // 2018-08-13 12:34:23 // 获取时间的方法 console.log(date.getFullYear()); //获取年 console.log(date.getMonth() + 1); //获取月 console.log(date.getDate()); //获取日 console.log('星期', date.getDay()); //获取星期几，星期一是用0表示，以此类推 console.log(date.getHours()) //获取时 console.log(date.getMinutes()) //获取分 console.log(date.getSeconds()) //获取秒 console.log(date.getMilliseconds()) //获取毫秒 //时间戳 console.log(date.getTime()); //单位是毫秒-----从1970年开始算 //0时区的时间 console.log(date.getUTCFullYear()) //获取年 console.log(date.getUTCDate()) //获取日 console.log(date.getUTCHours()) //获取与标准时间的时差 </script> </body> </html>
9 RegExp
正则
RegExp对象
test() 返回布尔值
exec() 返回数组，第一个匹配到的内容，位置。 全局匹配,所有匹配到的内容
String对象的方法
search() 第一次匹配到的位置，匹配不到 -1
match() 同r.exec()
replace() 替换，默认只替换一个，正则全局匹配
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>正则</title> </head> <body> <script> //创建正则对象 //var r = new RegExp(); //创建正则对象 var r = /^w{4,6}$/; //匹配以字母数字或下划线的字符开头及结尾的至少4个最多6个字符 console.log(r.test('abc')); //返回布尔值:false console.log(r.test('abc12')) //true console.log(r.exec('abc_nb')); // 返回数组 第一个元素 匹配到的内容，index指定匹配的位置:["abc_nb", index: 0, input: "abc_nb", groups: undefined] //字符串 方法匹配正则 var msg = 'hello world'; console.log(msg.search(/w/)); //返回第一次匹配的位置(即字符对应的索引值)---------------------0 console.log(msg.search(/o/)); //返回第一次匹配的位置----------------------------------------4 console.log(msg.search(/哈/)); //返回第一次匹配的位置 匹配不到返回-1------------------------(-1) console.log(msg.match(/w/)); //返回数组，数组中有 被匹配到的内容,["h", index: 0, input: "hello world", groups: undefined] console.log(msg.match(/w/g)); //匹配出 所有满足正则的字符串,["h", "e", "l", "l", "o", "w", "o", "r", "l", "d"] console.log(msg.replace(/o/g, '偶')) //匹配字符创中所有的o,并将其全部替换成偶 </script> </body> </html>