JS定时器/函数/Math/Date/字符串操作/
必看:JavaScript 世界万物诞生记
https://mp.weixin.qq.com/s?__biz=MzAxODE2MjM1MA==&mid=2651551424&idx=1&sn=1664da56c2785b83de565c49235a5827&chksm=8025a101b75228178ff08c0ce56913589782792aae3663520c912bafdff2c239b3c2b775d788&scene=0&key=ed67729252ec30b04734ad4dbafce3121a92688e7058b745134c1118a725b75f06741a02ef1ec1aa06cd3639bef5d55dbbf2ce1e4d87a6784069886a38a7fbffcf63a2809c10232181d8323e8802c515&ascene=0&uin=MjUwNzcwOTcwMA%3D%3D&devicetype=iMac+MacBookPro9%2C2+OSX+OSX+10.11.6+build(15G31)&version=12010210&nettype=WIFI&fontScale=100&pass_ticket=ngwhafaUv7l2VIz6ZY5BdSIMfRpeMlje1v8GmRoz%2B5NGFzcn%2FQNsqNNElyEdTOsf
1.函数
1.函数声明
- 特点:1.声明后不会执行,需要调用.2.关键字function;
- 类型: 1.参数 2 返回值
// 函数写法
function funName () {
alert('常规写法');
}
// 调用
funName();
2.函数调用
- 直接编写函数名,后面紧跟小括号
// 函数写法
function funName () {
alert('常规写法');
}
// 调用
funName();
3 将方法作为一个
// 作为方法
var obj = {
funName:function(){
alert('这个必须放在一个内部，放在外边会出错！');
}
}
// 调用方法
obj.funName();
3.函数表达式
使用变量保存一个函数
-
实际上是匿名函数 可以添加函数名
// 匿名函数 var myfun = function(){ alert('这是一种声明函数的方式，左边是一个变量，右边是一个函数的表达式，意思就是把一个匿名的函数表达式复制给了变量myfun，只是声明了一个变量指向了一个函数。'); } // 调用 myfun();
4.自调用函数
1. (function(){
alert(1);
})()
2. !function(){
alert(1);
}();
3. +function(){
alert(1);
}();
4. -function(){
alert(1);
}();
5.函数参数属性 arguments:代表参数的集合
6.参数:
- 参数类型:1隐藏参数:参数调用时的值 .2显示参数,定义时写的参数
- 默认参数:函数调用时缺少参数,默认是null
7.闭包:
http://www.jianshu.com/p/41c491ea745c
var add = (function() {
var count = 0;
return function(){
return +count;
}
}
8.构造函数
function Person(name, age){
this.name = name;
this.age = age;
this.sayName = function() {
alert(this.name);
};
}
var person1 = new Person("Steven", 21);
var person2 = new Person(...);
一道常被人轻视的前端JS面试题
2.全方位解读this
- 第一篇文章：
http://www.jianshu.com/p/d647aa6d1ae6
- 第一篇文章：https://mp.weixin.qq.com/s?__biz=MzAxODE2MjM1MA==&mid=2651551361&idx=1&sn=b23da766054bfbdfba45dc6e3808c3ef&chksm=8025a140b7522856e01993d06b3088f9318de43e63e7caacbd259505ff91798b88d74b2a04bd&scene=0&key=ed67729252ec30b067099f89c4117d60f75f5e24da4ab6014ae864a64608cac3d0759797adf1cfcb13f0cbe91106c38a478f5be40b7cc5decaad5134c555d2336b2e130c43a64e58db2aa0de95b2ad2a&ascene=0&uin=MjUwNzcwOTcwMA%3D%3D&devicetype=iMac+MacBookPro9%2C2+OSX+OSX+10.11.6+build(15G31)&version=12010210&nettype=WIFI&fontScale=100&pass_ticket=ngwhafaUv7l2VIz6ZY5BdSIMfRpeMlje1v8GmRoz%2B5NGFzcn%2FQNsqNNElyEdTOsf
3.对象
JavaScript 对象是拥有属性和方法的数据。 就是key:value 也叫name:value
对象定义
1，var car = {
type:"Fiat",
model:500,
color:"white"
};
//定义 JavaScript 对象可以跨越多行，空格跟换行不是必须的：
2, var car = {};
car.type = 'Fiat';
car.model = '500';
car.color = 'white'
//JavaScript 对象是变量的容器。
获取对象value
var person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};
1，person.lastName; //John 常用这种
2，person["lastName"]; //John 用在number上 是不是跟数组一样的 所有数据也是对象特殊的一种
例如：var a = {1:'22',2:'2323'};
a.1 //报错
a[1] //22 在key 值为number的时候用
对象value 可以为function(){}
在对象中name:function(){};
var a = {
a:'这就我',
method:function(){
console.log( 'ddd' )
}
}
a: text //这就我
a.method() //打印出ddd 类似匿名函数
遍历对象 也叫枚举对象( 面试官会问的 )
for in
var car = {type:"Fiat", model:500, color:"white"};
for ( var i in car ){
console.log( i+':'+car[i] )
}
//type:Fiat, model:500, color:white
http://www.w3cplus.com/javascript/how-do-i-enumerate-the-properties-of-a-javascript-object.html
该文章有关于JavaScript中对象属性枚举的几种方：
** 四种方法 **
- for ... in
- Object.keys()
- Object.getOwnPropertyNames()
- for ... of (ES6新增的方法)-
4.Array 数组方法
concat() //连接两个或更多的数组，并返回结果。
join() //把数组的所有元素放入一个字符串。元素通过指定的分隔符进行分隔。
pop() //删除并返回数组的最后一个元素
push() //向数组的末尾添加一个或更多元素，并返回新的长度。
reverse() //颠倒数组中元素的顺序。
shift() //删除并返回数组的第一个元素
slice() //从某个已有的数组返回选定的元素
sort() //对数组的元素进行排序
splice() //删除元素，并向数组添加新元素。
toSource() //返回该的源代码。
toString() //把数组转换为字符串，并返回结果。
toLocaleString() //把数组转换为本地数组，并返回结果。
unshift() //向数组的开头添加一个或更多元素，并返回新的长度。
valueOf() //返回数组的原始值
实例
5.js数组操作大全（转）
shift：删除原数组第一项，并返回删除元素的值；如果数组为空则返回undefined
var a = [1,2,3,4,5];
var b = a.shift(); //a：[2,3,4,5] b：1
unshift：将参数添加到原数组开头，并返回数组的长度
var a = [1,2,3,4,5];
var b = a.unshift(-2,-1); //a：[-2,-1,1,2,3,4,5] b：7
注：在IE6.0下测试返回值总为undefined，FF2.0下测试返回值为7，所以这个方法的返回值不可靠，需要用返回值时可用splice代替本方法来使用。
pop：删除原数组最后一项，并返回删除元素的值；如果数组为空则返回undefined
var a = [1,2,3,4,5];
var b = a.pop(); //a：[1,2,3,4] b：5
push：将参数添加到原数组末尾，并返回数组的长度
var a = [1,2,3,4,5];
var b = a.push(6,7); //a：[1,2,3,4,5,6,7] b：7
concat：返回一个新数组，是将参数添加到原数组中构成的
var a = [1,2,3,4,5];
var b = a.concat(6,7); //a：[1,2,3,4,5] b：[1,2,3,4,5,6,7]
splice(start,deleteCount,val1,val2,...)：从start位置开始删除deleteCount项，并从该位置起插入val1,val2,...
var a = [1,2,3,4,5];
var b = a.splice(2,2,7,8,9); //a：[1,2,7,8,9,5] b：[3,4]
var b = a.splice(0,1); //同shift
a.splice(0,0,-2,-1); var b = a.length; //同unshift
var b = a.splice(a.length-1,1); //同pop
a.splice(a.length,0,6,7); var b = a.length; //同push
reverse：将数组反序
var a = [1,2,3,4,5];
var b = a.reverse(); //a：[5,4,3,2,1] b：[5,4,3,2,1]
sort(orderfunction)：按指定的参数对数组进行排序
var a = [1,2,3,4,5];
var b = a.sort(); //a：[1,2,3,4,5] b：[1,2,3,4,5]
slice(start,end)：返回从原数组中指定开始下标到结束下标之间的项组成的新数组
var a = [1,2,3,4,5];
var b = a.slice(2,5); //a：[1,2,3,4,5] b：[3,4,5]
join(separator)：将数组的元素组起一个字符串，以separator为分隔符，省略的话则用默认用逗号为分隔符
var a = [1,2,3,4,5];
var b = a.join("|"); //a：[1,2,3,4,5] b："1|2|3|4|5"
数组是JavaScript提供的一个内部，它是一个标准的集合，我们可以添加(push)、删除(shift)里面元素，我们还可以通过for循环遍历里面的元素，那么除了数组我们在JavaScript里还可以有别的集合吗?
由于JavaScript的语言特性，我们可以向通用动态添加和删除属性。所以Object也可以看成是JS的一种特殊的集合。下面比较一下Array和Object的特性:
新建:var ary = new Array(); 或 var ary = [];
增加:ary.push(value);
删除:delete ary[n];
遍历:for ( var i=0 ; i < ary.length ; ++i ) ary[i];
新建:var obj = new Object(); 或 var obj = {};
增加:obj[key] = value; (key为string)
删除:delete obj[key];
遍历:for ( var key in obj ) obj[key];
从上面的比较可以看出Object完全可以作为一个集合来使用，在使用Popup窗口创
建无限级Web页菜单(3)中我介绍过Eric实现的那个MenuCache，它也就是一个模拟的集合。
如果我们要在Array中检索出一个指定的值，我们需要遍历整个数组:
6.字符串操作
重要性：重要
indexOf() 检索字符串。
match() 找到一个或多个正则表达式的匹配。
split() 把字符串分割为字符串数组。
replace() 替换与正则表达式匹配的子串。
search() 检索与正则表达式相匹配的值。
slice() 提取字符串的片断，并在新的字符串中返回被提取的部分。
substr() 从起始索引号提取字符串中指定数目的字符。
substring() 提取字符串中两个指定的索引号之间的字符。
toLocaleLowerCase() 把字符串转换为小写。
toLocaleUpperCase() 把字符串转换为大写。
toLowerCase() 把字符串转换为小写。
toUpperCase() 把字符串转换为大写。
toString() 返回字符串。
valueOf() 返回某个字符串的原始值。
charAt() 返回在指定位置的字符。
concat() 连接字符串。
重要性：一般
anchor() 创建 HTML 锚。
big() 用大号字体显示字符串。
blink() 显示闪动字符串。
bold() 使用粗体显示字符串。
charCodeAt() 返回在指定的位置的字符的 Unicode 编码。
fixed() 以打字机文本显示字符串。
fontcolor() 使用指定的颜色来显示字符串。
fontsize() 使用指定的尺寸来显示字符串。
fromCharCode() 从字符编码创建一个字符串。
italics() 使用斜体显示字符串。
lastIndexOf() 从后向前搜索字符串。
link() 将字符串显示为链接。
localeCompare() 用本地特定的顺序来比较两个字符串。
small() 使用小字号来显示字符串。
strike() 使用删除线来显示字符串。
sub() 把字符串显示为下标。
sup() 把字符串显示为上标。
toSource() 代表的源代码。
7.Date
Date() 返回当日的日期和时间。
//重要性：重要
参数形式
- 1）new Date("month dd,yyyy hh:mm:ss");
- 2）new Date("month dd,yyyy");
- 3）new Date(yyyy,mth,dd,hh,mm,ss);
- 4）new Date(yyyy,mth,dd);
- 5）new Date(ms);
getDate() 从 Date 返回一个月中的某一天 (1 ~ 31)。
getDay() 从 Date 返回一周中的某一天 (0 ~ 6)。
getMonth() 从 Date 返回月份 (0 ~ 11)。
getFullYear() 从 Date 以四位数字返回年份。
getHours() 返回 Date 的小时 (0 ~ 23)。
getMinutes() 返回 Date 的分钟 (0 ~ 59)。
getSeconds() 返回 Date 的秒数 (0 ~ 59)。
getMilliseconds() 返回 Date 的毫秒(0 ~ 999)。
getTime() 返回 1970 年 1 月 1 日至今的毫秒数。
toLocaleString() 根据本地时间格式，把 Date 转换为字符串。
toLocaleTimeString() 根据本地时间格式，把 Date 的时间部分转换为字
parse() 返回1970年1月1日午夜到指定日期（字符串）的毫秒数。
//重要性：一般
getTimezoneOffset() 返回本地时间与格林威治标准时间 (GMT) 的分钟差。
getUTCDate() 根据世界时从 Date 返回月中的一天 (1 ~ 31)。
getUTCDay() 根据世界时从 Date 返回周中的一天 (0 ~ 6)。
getUTCMonth() 根据世界时从 Date 返回月份 (0 ~ 11)。
getUTCFullYear() 根据世界时从 Date 返回四位数的年份。
getUTCHours() 根据世界时返回 Date 的小时 (0 ~ 23)。
getUTCMinutes() 根据世界时返回 Date 的分钟 (0 ~ 59)。
getUTCSeconds() 根据世界时返回 Date 的秒钟 (0 ~ 59)。
getUTCMilliseconds() 根据世界时返回 Date 的毫秒(0 ~ 999)。
parse() 返回1970年1月1日午夜到指定日期（字符串）的毫秒数。
setDate() 设置 Date 中月的某一天 (1 ~ 31)。
setMonth() 设置 Date 中月份 (0 ~ 11)。
setFullYear() 设置 Date 中的年份（四位数字）。
setHours() 设置 Date 中的小时 (0 ~ 23)。
setMinutes() 设置 Date 中的分钟 (0 ~ 59)。
setSeconds() 设置 Date 中的秒钟 (0 ~ 59)。
setMilliseconds() 设置 Date 中的毫秒 (0 ~ 999)。
setTime() 以毫秒设置 Date 。
setUTCDate() 根据世界时设置 Date 中月份的一天 (1 ~ 31)。
setUTCMonth() 根据世界时设置 Date 中的月份 (0 ~ 11)。
setUTCFullYear() 根据世界时设置 Date 中的年份（四位数字）。
setUTCHours() 根据世界时设置 Date 中的小时 (0 ~ 23)。
setUTCMinutes() 根据世界时设置 Date 中的分钟 (0 ~ 59)。
setUTCSeconds() 根据世界时设置 Date 中的秒钟 (0 ~ 59)。
setUTCMilliseconds() 根据世界时设置 Date 中的毫秒 (0 ~ 999)。
toSource() 返回该的源代码。
toString() 把 Date 转换为字符串。
toTimeString() 把 Date 的时间部分转换为字符串。
toDateString() 把 Date 的日期部分转换为字符串。
toUTCString() 根据世界时，把 Date 转换为字符串。符串。
toLocaleDateString() 根据本地时间格式，把 Date 的日期部分转换为字符串。
UTC() 根据世界时返回 1970 年 1 月 1 日 到指定日期的毫秒数。
valueOf() 返回 Date 的原始值。
8.Math
//重要性：重要
Math 方法
Math.abs(x) 返回数的绝对值。
Math.ceil(x) 对数进行上舍入。
Math.floor(x) 对数进行下舍入。
Math.log(x) 返回数的自然对数（底为e）。
Math.max(x,y) 返回 x 和 y 中的最高值。
Math.min(x,y) 返回 x 和 y 中的最低值。
Math.pow(x,y) 返回 x 的 y 次幂。
Math.random() 返回 0 ~ 1 之间的随机数。
round(x) 把数四舍五入为最接近的整数。
Math.sqrt(x) 返回数的平方根。
Math.valueOf() 返回 Math 的原始值。
//重要性：一般
Math 属性
Math.E 返回算术常量 e，即自然对数的底数（约等于2.718）。
Math.LN2 返回 2 的自然对数（约等于0.693）。
Math.LN10 返回 10 的自然对数（约等于2.302）。
Math.LOG2E 返回以 2 为底的 e 的对数（约等于 1.414）。
Math.LOG10E 返回以 10 为底的 e 的对数（约等于0.434）。
Math.PI 返回圆周率（约等于3.14159）。
Math.SQRT1_2 返回返回 2 的平方根的倒数（约等于 0.707）。
Math.SQRT2 返回 2 的平方根（约等于 1.414）。
JavaScript 变量提升
JavaScript 中，函数及变量的声明都将被提升到函数的最顶部。
JavaScript 中，变量可以在使用后声明，也就是变量可以先使用再声明。
只有这个var 才会被提升
只有声明 还没赋值的话 变量才会提升
只有这个var 才会被提升
x = 5; // 变量 x 设置为 5
elem = document.getElementById("demo"); // 查找元素
elem.innerHTML = x; // 在元素中显示 x
var x; // 声明 x
声明并且赋值的话 不会被提升
var y = 7; // 初始化 y
elem = document.getElementById("demo"); // 查找元素
elem.innerHTML = x + " " + y; // undefined 7 x报错了
var x = 5; // 初始化 x 已经赋值了 不会被提升
在头部声明你的变量 可以不用先赋值
use strict 情况下就不允许提升了
10.定时器
1.setTimeout(Expression,DelayTime),
在DelayTime过后,将执行一次Expression,
setTimeout 运用在延迟一段时间，再进行某项操作。
setTimeout("",time) 设置一个超时**
2.setInterval(expression,delayTime),
每个DelayTime,都将执行Expression.
常常可用于刷新表达式.setInterval("",time)
设置一个超时
- SetInterval为自动重复，setTimeout不会重复。
- clearTimeout() 清除已设置的setTimeout
- clearInterval() 清除已设置的setInterval