JavaScript入门基础
JavaScript入门基础
JavaScript是运行在浏览器中的解释型编程语言。在web的世界里只有JavaScript能够跨平台、跨浏览器驱动网页，与用户交互。JavaScript是严格区分大小写的。
一、开篇
1.js代码能直接嵌入网页的任何地方，通常放在中，但会要求用户把所有js代码都下载解析执行以后在呈现内容；
2.可以把代码单独的放在一个.js文件中，同时，多个页面可以引用同一份.js文件；.js文件与jsp文件一起存放在WebContent目录下；
3.页面中可以多次编写,但是浏览器会按照顺序执行这些JavaScript代码；
4.JavaScript中每个语句以 ； 结尾 每个语句块以 {…..} 注释用//或/* */
5.所有类型都是定义变量都是用 var， 如果一个变量没有通过var申明就被使用，那么该变量就自动被申明为全局变量，而启用strict模式会强制使用var申明变量（代码的第一行写上： 'use strict'; ）；
Hello js！
1. %求余运算，&&并且，||或者，==自动转换类型在比较，===(建议使用)不自动转换类型，但数据类型不同时会返回false；
2. NaN 属性是代表非数字值的特殊值，与所有其他值都不相等，包括它自己：
NaN === NaN; // false
isNaN(NaN); // true，只能用isNaN判断3.浮点数在运算过程中会产生误差，因为计算机无法精确表示无限循环小数；
Math.abs(1 / 3 - (1 - 2 / 3)) < 0.0000001; // true
4.alert('我不想执行');
alert('我也不想执行');
这样的分两次执行，先执行第一句在执行第二句；
5.JavaScript的设计者希望用null表示一个空的值，而undefined表示值未定义；
二、 字符串
1.字符串用''或""括起来的字符表示，字符串内含有“ ” ‘ ’ 的使用转义符 \ ；
2.多行字符串用`….`来表示，+号连接，${name}模板字符串，直接用在字符串中代替为name的属性的值；
字符串操作：
var s = 'Hello';
s.length; //字符串s的长度
s[0]; // 返回 'H' ，要获取字符串某个指定位置的字符，使用类似Array的下标操作，索引号从0开始：
s[1]; // 返回 'e '
s[2]; // 返回 'l'
s[3]; // 返回 'l'
s[13]; // undefined 超出范围的索引不会报错，但一律返回undefined
s.toUpperCase(); // 返回'HELLO'转换为大写的
s.toLowerCase(); // 返回'hello'转换为小写的
str.indexOf('ll'); // 返回2 在字符串中找到其出现的位置,没有找到指定的子串，返回-1
s.substring(0, 5); // 从索引0开始到5（不包括5），返回'Hello'
s.substring(x); // 从索引x开始到结束
三、数组
1.Array提供了一种顺序存储一组元素的功能，并可以按索引来读写。
2.JavaScript的数组可以包括任意数据类型；字符串是不可变的，但是数组是可变的，可以通过索引号来改变；
(1)创建数组，在JavaScript中有两种方法创建数组：
var arr = [1, 2, 3.14, 'Hello', null, true]; //创建数组
var arr = new Array(1,2,3); //创建数组
arr.length; //获取数组长度，就是数组有几个元素
arr.length = 2; //给length赋值会改变数组的长度，变为arr={1,2}索引只有0,1
arr[1] = 99; //索引为1处改变，arr数组变为（1,99,3），而字符串就不行了
arr[5] = 'x'; // arr变为[1, 2, 3, undefined, undefined, 'x'],不会报错的，不建议这样做。(2)indexOf()搜索一个指定的元素的位置，与String类似，返回它的索引，没找到返回-1:
var arr = ['A','B', '10',20]; //'10'是一个字符串了
arr.indexOf('A'); // 元素A的索引为0
arr.indexOf('B'); // 元素B的索引为1
arr.indexOf(10); // 元素10没有找到，返回-1(3)slice()截取Array的部分元素，就是对应String的substring()版本，然后返回一个新的Array：
var arr =['a','b','c','d','e'];
arr.slice(0, 3); // 从索引0开始，到索引3结束，但不包括索引3: ['a', 'b', 'c']
arr.slice(3); // 从索引3开始到结束: ['d', 'e'],不给slice()任何参数，它就从头到尾截取所有元素;(4)push()向Array的末尾添加若干元素,pop()则把Array的最后一个元素删除掉：
arr.push('A', 'B'); // 直接向array的数组中末尾添加,返回数组长度
arr.pop(); //从数组的后面删除一个元素，返回被删除的元素
arr.pop(); // 删除到没有元素后空数组继续pop不会报错，而是返回undefined(5)unshift()往Array的头部添加若干元素,shift()方法则把Array的第一个元素删掉;
arr.unshift('A', 'B'); //在数组头部添加，返回数组长度
arr.shift(); //在数组头部删除一个元素，返回被删除的数
arr.shift(); // 空数组继续shift不会报错，而是返回undefined(6)sort()可以对当前Array进行排序，直接调用时，按照默认顺序排序;reverse()把整个Array的元素给掉个个，也就是反转;
var arr = ['B', 'C', 'A'];
arr.sort(); // ['A', 'B', 'C']
arr.reverse(); //['C','B','A'](7)splice()方法是修改Array的“万能方法”，它可以从指定的索引开始删除若干元素，然后再从该位置添加若干元素;
var arr = [1, 2, 3, 4, 5, 6];
arr.splice(2, 3, 'a', 'b'); // 从索引2开始删除3个元素,然后再添加两个元素[1, 2, 'a', 'b', 6]
arr.splice(2, 2); // 从索引2开始删除2个元素，返回被删除元素 一个数组
arr.splice(2, 0, 'c', 'd'); // 从索引2开始删除0个元素，返回[],因为没有删除任何元素(8)concat()方法把当前的Array和另一个Array连接起来，并返回一个新的Array（只有截取和连接时是返回一个新的数组的）
var arr = ['A', 'B', 'C'];
var add = arr.concat([1, 2, 3]); //arr后添加上一个数组后为['A', 'B', 'C', 1, 2, 3]；返回了一个新的数组add
arr.concat(1, 2, [3, 4]); //所有的都连起来返回一个新的数组['A', 'B', 'C', 1, 2, 3, 4](9)join()方法是一个非常实用的方法，它把当前Array的每个元素都用指定的字符串连接起来，然后返回连接后的字符串;
var arr =['A','B','C',1,2,3];
var s = arr.join('-');
alert(s); //输出 A-B-C-1-2-3(10)first(),last()获取第一个和最后一个元素
var arr = [2, 4, 6, 8];
var a = _.first(arr,2); //从数组arr头部开始截取2个元素 2,4
var b = _.last(arr,2); //从数组arr的尾部开始结局2个元素 6,8
alert(a);(11)flatten()嵌套多少个数组最后返回的都是一个数组
var a = _.flatten([1, [2], [3, [[4], [5]]]]); // a=[1, 2, 3, 4, 5](12)zip()把多个数组按索引组成新的数组，unzip()反过来（_有时候会显示未定义可能是浏览器问题，有事后又是可以运行的）
var names = ['小明', '小红', '小白'];
var scores = [85, 92, 59];
var nas= _.zip(names, scores); // 返回一个数组 [['小明', 85], ['小红', 92], ['小白', 59]]
_.unzip(nas); // [['小明', '小红', '小白'], [85, 92, 59]](13)object(),替代zip(),把两个数组按照索引组成一个对象；
_.zip(names, scores); // [['小明', 85], ['小红', 92], ['小白', 59]]
_.object(names, scores); // {'小明': 85, '小红': 92, '小白': 59}(14)range()快速生成一个数组
_.range(10); // 从0开始小于10，[0, 1, 2, 3, 4, 5, 6, 7, 8, 9]
_.range(1, 11); // 从1开始小于11，[1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
_.range(0, 30, 5); //从0开始小于30，步长5， [0, 5, 10, 15, 20, 25]
_.range(0, -10, -1); // 从0开始大于-10，步长-1，[0, -1, -2, -3, -4, -5, -6, -7, -8, -9]四、对象
JavaScript的对象是一种无序的集合数据类型，它由若干键值对组成，用于描述现实世界中的某个对象.
var duixiang ={
name:'李四',
birth:1999,
birthday:'1999.9.9',
'middle-school': 'No.1 Middle School'
} //对象中有点 . 用用‘’扩起来
duixiang.name; //李四
duixiang['middle-school']; //在对象中时加了‘’所以要这样才能访问
duixiang.qqq="hehe"; //添加
delete duixiang.birth; //可以直接的增加删除
duixiang.hasOwnProperty('name'); //判断是否拥有这个属性true
duixiang.hasOwnProperty('birth'); // false五、条件和循环
条件判断：if（）{} else {} 或者if（）{} else if （）{} else {}
循环：for（） while（） do...while（）
var a =[1,2,3]
for (var key in a) {
alert(key); // 依次输出他的索引
}
for (var key of a){
alert(key); // 依次输出它的值
}
var b = {
name:'maomao',
'y-m-d':'2014.9'
}
for (var key in b){
alert(key);// 依次输出对象的key，就是属性名；
}
for (var key of b){
alert(key);// 不可用因为object是不可迭代的
}
//for key of xxx 可以用在array ，map ，set ；六、map和set，iterable（可迭代的）
JavaScript的对象有个小问题，就是键必须是字符串。
Map是一组键值对的结构，具有极快的查找速度。
var m = new Map([['李四', 95], ['张三', 85], ['毛毛', 75]]);
m.get('毛毛'); // 85
m.set('小二', 65); //添加新的key-value
m.set('呵呵', 66);
m.has('小二'); //判断是否存在key '小二': true
m.get('呵呵'); // 66
m.delete('小二'); //删除key '小二'set和Map类似，也是一组key的集合，但不存储value。由于key不能重复，所以，在Set中，没有重复的key(重复的会被过滤掉)。
var s1 = new Set([1, 2, 3]); // 含1, 2, 3
var s = new Set();
s.add("Thomas Jefferson");//增加元素
s.add(1776);
s.add("founding father");
s.delete(1776);
s.forEach(function (item) { //对集合中每个元素进行操作
document.write(item.toString() + ", ");
});for ... of循环,只循环集合本身的元素：
var a = ['A', 'B', 'C'];
a.name = 'Hello';
for (var x of a) {
alert(x); // 'A', 'B', 'C' 没有hello的；
}
//但是使用forEach（）更方便
a.forEach(function (element, index, array) {
// element: 指向当前元素的值
// index: 指向当前索引
// array: 指向Array对象本身，如果是set则写成set
alert(element);
});好了，基础入门结束！