JavaScript基础
第一节 JS简介
95年诞生 script代表脚本 脚本语言运行时才用解释器加载代码，编译语言则需要编译器。
能够脱离浏览器运行 node.js 也叫后端的JS
js语法核心+dom编程+bom编程
所有现代的 HTML 页面都使用 JavaScript，可以用于改进设计、验证表单、检测浏览器、创建cookies等。
第二节 变量 表达式 运算符
alert() 弹出窗口显示
<body> //推荐放在body里
<script type="text/javascript" >
alert("hello world") //控制弹出窗口
</script>
</body>
var 声明变量
typeof 返回类型
第三节 流程控制语句
for in 一般用来循环复杂的对象
for(var name in window){
console.log(name); //在浏览器console上打印对应的属性
}
label语法
label: 声明
outloop:
for(var i=0;i<3;i++){
for(var j=0;j<3;j++){
if(i==1&&j==1){
break outloop; //直接跳到outloop所在层 此处是跳出两层循环
}
num++;
}
}
第四节 函数 引用类型 作用域
函数
function add(num1,num2) {
return num1+num2;
}
arguments 是一个类数组对象。代表传给一个function的参数列表。
function add() { //形参可写可不写 JS里只是提示作用
console.log(arguments.length) // 直接用数组接受传递形参
}
var a=2;
var b=3;
var v="laowang";
add(a,b,v);
instanceof适用于引用数据类型，判断左侧的类型是否是右侧的类型，返回boolean类型
var a=[1,2,3];
function test(param) {
if(a instanceof Array){
param[2]=5;
}
}
JavaScript 中，函数及变量的声明都将被提升到函数的最顶部。
JavaScript 中，变量可以在使用后声明，也就是变量可以先使用再声明。
即变量提升：函数声明和变量声明总是会被解释器悄悄地被"提升"到方法体的最顶部。
通常我们在每个作用域开始前声明这些变量。
因为javascript代码并不是一行一行往下执行的，javascript的执行分为两个步骤：编译（词法解释/预解释），执行。当我们碰到 var a = “laowang” 定义一个变量的时候， 其实js把这句话看成是2个阶段的事, var a 发生在编译阶段， a = 'laowang’发生在执行阶段. 然后 var a会被提升到当前作用域的最前面, a = 'laowang’留在原地等待执行阶段。
在ES6之前，我们都是用var来声明变量，而且JS只有函数作用域和全局作用域，没有块级作用域，所以{}限定不了var声明变量的访问范围。ES6新增的let，可以声明块级作用域的变量。
ES6 明确规定，如果区块中存在let和const命令，这个区块对这些命令声明的变量，从一开始就形成了封闭作用域。凡是在声明之前就使用这些变量，就会报错。总之，在代码块内，使用let命令声明变量之前，该变量都是不可用的。这在语法上，称为“暂时性死区”（temporal dead zone，简称 TDZ）。
let不允许在相同作用域内，重复声明同一个变量。
第五节 Object Array
创建对象并赋值
// let person=new Object();
// person.name="laowang";
// person.age=29;
// person.height=180;
var person ={
"name":"laowang",
"age":29,
"height":180
}
额外的访问方式：用方括号访问
console.log(person["age"]);
这样可以在给对象传参时不写具体值，比如
let a="age";
console.log(person[a]); //这里传了一个变量去寻找。
JS数组的长度会自动扩展，但不应利用。
let colors=["green","yellow","red"];
colors[0]="blue";
colors.length;
colors[8]="pink";
console.log(colors);
Array.isArray() 检测是否数组对象
console.log(colors.join("|")); //以 | 作为间隔打印输出colors的属性
.push() 压入数组（从最后加入新元素） .pop() 以栈的方式取（最后入栈） .shift() 以队列的方式取（最先入队） .unshift() 逆向队列的加入数组（从最前面加入新元素）
数组的排序： array.sort() //按自然增长排序 array.reverse() //逆转
数组的拼接：array.concat(); //可以给数组拼接字符串、data、其他数组
数组的删除：arrays.splice();
let colors=["green","red","yellow","pink"];
colors.splice(0,1); //从0号元素开始，删除一个元素
数组的插入：
colors.splice(2,0,"blue","“black"); //从起始的index （2） 开始，删除0个，插入blue，black
数组的foreach循环 ： item 代表每次循环的元素，index 角标
colors.forEach(function (item,index,array) {
console.log(item);
console.log(index);
console.log(array);
})
数组的every判断：
let num=[1,3,4,2,6,5,7];
let flag=num.every(function (item,index,array) { //每个item都满足条件才能返回true
return (item<4);
})
console.log(flag); //输出false
数组的filter（过滤器）：
let newNum=num.filter(function(item){
return item>4;
})
console.log(newNum); //打印出[6,5,7]
filter() 方法创建一个新的数组，新数组中的元素是通过检查指定数组中符合条件的所有元素。
注意： filter() 不会对空数组进行检测。
注意： filter() 不会改变原始数组。
数组的map：
let newNum=num.map(function(item){
return item*2;
})
console.log(newNum);
map() 方法返回一个新数组，数组中的元素为原始数组元素调用函数处理后的值。
map() 方法按照原始数组元素顺序依次处理元素。
数组的 reduce（归并操作）：
var sum=num.reduce(function (prev,cur,index,array) {
return prev+cur;
})
console.log(sum);
reduce() 方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值。
reduce() 可以作为一个高阶函数，用于函数的 compose。
注意: reduce() 对于空数组是不会执行回调函数的。
数组的some：
some() 方法用于检测数组中的元素是否满足指定条件（函数提供）。
some() 方法会依次执行数组的每个元素：
- 如果有一个元素满足条件，则表达式返回true , 剩余的元素不会再执行检测。
- 如果没有满足条件的元素，则返回false。
第六节 Date 正则表达式RegExp Function
RegExp
格式： /pattern/modifiers;
let re =new RegExp("a","i");
//匹配11手机号
let re = /^[1][3,5,7,8][0-9]{9}$/;
let mobile="18947637845";
console.log(re.test(mobile));
modifiers
g （全文查找出现的所有 pattern）
i （忽略大小写）
m （多行查找）
正则表达式中的特殊字符
^ 匹配一个输入或一行的开头，/^a/匹配"an A"，而不匹配"An a"
$ 匹配一个输入或一行的结尾，/a$/匹配"An a"，而不匹配"an A"
* 匹配前面元字符0次或多次，/ba*/将匹配b,ba,baa,baaa
+ 匹配前面元字符1次或多次，/ba*/将匹配ba,baa,baaa
? 匹配前面元字符0次或1次，/ba*/将匹配b,ba
(x) 匹配x保存x在名为$1…$9的变量中
x|y 匹配x或y
{n} 精确匹配n次
{n,} 匹配n次以上
{n,m} 匹配n-m次
[xyz] 字符集(character set)，匹配这个集合中的任一一个字符(或元字符)
[^xyz] 不匹配这个集合中的任何一个字符
[\b] 匹配一个退格符
\b 匹配一个单词的边界
\B 匹配一个单词的非边界
\d 匹配一个数字字符，/\d/ = /[0-9]/
\D 匹配一个非字数字符，/\D/ = /[^0-9]/
\n 匹配一个换行符
\r 匹配一个回车符
\s 匹配一个空白字符，包括\n,\r,\f,\t,\v等
\S 匹配一个非空白字符，等于/[^\n\f\r\t\v]/
\t 匹配一个制表符
\v 匹配一个重直制表符
\w 匹配一个可以组成单词的字符(alphanumeric，这是我的意译，含数字)，包括下划线，如[\w]匹配"$5.98"中的5，等于[a-zA-Z0-9]
\W 匹配一个不可以组成单词的字符，如[\W]匹配" 5.98 " 中 的 5.98"中的 5.98"中的，等于[^a-zA-Z0-9]。
替换字符串
stringObject.replace() 方法用于在字符串中用一些字符替换另一些字符，或替换一个与正则表达式匹配的子串。
stringObject.replace(regexp/substr,replacement)
切割字符串
var sArray=str.split("A");
console.log(sArray);
Function
JS中，函数可以接受函数的参数（函数也被当作一种数据类型）
function callFunction(someFunction,arg) {
return someFunction(arg);
}
抽离比较器函数作为参数返回，可以达到多种相同判断逻辑的排序调用同一个比较器函数
var array=[person1,person2];
console.log(array);
array.sort(createComparator("age"));
function createComparator(propertyName){
return function (object1,object2) {
var value1=object1[propertyName];
var value2=object2[propertyName];
if(value1>value2){
return 1;
}
if(value1<value2){
return -1;
}
else{
return 0;
}
};
}
console.log(createComparator.length); //打印建议接收参数的个数长度，此处为1
在 JS 对象中，调用属性一般有两种方法——点和中括号的方法。
点方法是在对象名后面跟上属性名，而中括号方法里的索引存放与属性名字相同的字符串
点方法后面跟的必须是一个指定的属性名称，而中括号方法里面可以是变量。
var haha = "name";
console.log(obj.haha); // undefined
console.log(obj[haha]); // cedric
.apply() 方法：改变作用域
window.color="red";
var o={color:"green"};
function showColor() {
console.log(this.color);
}
showColor(); //输出red
showColor.apply(o); //输出green
apply传参方法
function sum(num1,num2) {
return num1+num2;
}
function callSum1(num1,num2){
return sum.apply(this,arguments);
}
function callSum2(num1,num2) {
return sum.apply(this,[num1,num2]);
}
console.log(window);
.call() 方法
function sum(num1,num2) {
return num1+num2;
}
function callSum2(num1,num2) {
return sum.apply(this,num1,num2); //传参时受到约束
}
console.log(window);
apply()方法 接收两个参数，一个是函数运行的作用域（this），另一个是参数数组。
call()方法 第一个参数和apply()方法的一样，但是传递给函数的参数必须列举出来。
.substr() 方法
可在字符串中抽取从 start 下标开始的指定数目的字符。
stringObject.substr(start,length)
start
要抽取的子串的起始下标。必须是数值。如果是负数，那么该参数声明从字符串的尾部开始算起的位置。也就是说，-1 指字符串中最后一个字符，-2 指倒数第二个字符，以此类推。
length
可选。子串中的字符数。必须是数值。如果省略了该参数，那么返回从 stringObject 的开始位置到结尾的字串。
var falseObject=new Boolean(false);
var fal=false;
var result="false"&&true; //true
//var result=falseObject&&true; //true
//var result=falseObject.valueOf()&&true; //false
console.log(result);
Number类型
let number=10;
console.log(number.toFixed(2));
let number=124364;
console.log(number.toExponential(1));
console.log(number.toPrecision(2));
let s1="lao wa ng";
console.log(s1.indexOf(" "));
console.log(s1.slice(3,5));
对网址编码为了使浏览器更好的识别，解码可以进行字符串操作
var www=encodeURI("http://coder520.com/courses/36/ 279");
console.log(www);
//能以编码表示出空格
var www1=encodeURIComponent("http://coder520.com/courses/36/ 279");
//替换所有特殊符号
console.log(www1);
window.location.href=encodeURI("http://coder520.com");
//控制浏览器的跳转时最好encode
.eval()
eval() 函数可计算某个字符串，并执行其中的的 JavaScript 代码。
Math
第八节 对象属性类型
JS中没有类的概念
属性类型
1.数据属性（控制数据是不是能拿）
configurable：控制属性是否可以被delete
enumerable：是否可枚举，是否能通过for in 循环返回该属性
writable：是否可修改
用 Object.getOwnPropertyDescriptors(obj) 可以获取对象的所有属性，包括属性的特性。
let person={
name:"laowang",
age:29
}
Object.defineProperty(person,"name",{
configurable:false,
value:"laoli"
})
delete person.name; //无效
console.log(person.name);
2.访问器属性
configurable
enumerable
set
get
JQuery了解
语法
基础语法是：$(selector).action()
- 美元符号定义 jQuery
- 选择符（selector）“查询”和“查找” HTML 元素
- jQuery 的 action() 执行对元素的操作
.ready()
当 DOM（文档对象模型） 已经加载，并且页面（包括图像）已经完全呈现时，会发生 ready 事件。由于该事件在文档就绪后发生，因此把所有其他的 jQuery 事件和函数置于该事件中是非常好的做法。
选择器
jQuery 使用 CSS 选择器来选取 HTML 元素。
$(“p”) 选取
元素。
$(“p.intro”) 选取所有 class=“intro” 的
元素。
$(“p#demo”) 选取所有 id=“demo” 的
元素。
17万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
