ECMAscript 笔记

JS的引入方式：

1.内嵌:作为Body的最后一个子元素
<script></script>

2.外联：通过script标签的src属性，引入外部的js文件 (推荐)
<script src="test.js"></script>

3.通过元素的事件属性写入js

<div onclick="写入js"></div>

4.通过a标签的href属性写入js，伪url方法
<a href="javascript:alert('hello world')">伪url方法</a>

为符合 web 标准（w3c 标准中的一项）结构（html）、行为（js）、样式（css）相分离，通常会采用外部引入。

主流引擎
IE -------------trident(内核);
chrome-------webkit/blink;
firefox---------gecko;
opera----------presto;
safari----------webkit;

js 三大部分 ECMAScript、DOM、BOM

js基本语法

1.变量

1）声明变量：**

看都可以，推荐第三种
2）命名规则（用接近的英文单词）———— 起变量名一定要以英文语义化
1.变量名必须以英文字母、、$ 开头
2.变量名可以包括英文字母，，$，数字
3.不可以用系统的关键字、保留字作为变量名

2.基本数据类型

Number,String,Boolean,undefined,null（值不可改变，只会改房间编号）
Number 数字,例 var a = 123;

String 字符串,语言放双引号里，例 var a=”语言”，““是空串

Boolean 布尔数字,就两个值，false，true

undefined 是没有定义的，表示还没赋值,仅一个值 underfined

null 代表空，占位用，用空值来覆盖

js 语句基本规则
1、语句后面要用分号结束“；”但 function test(){}，for(){}，if(){}后面都不用加分号
2、js 语法错误会引发后续代码终止，但不会影响其它 js 代码块

3.js运算符

运算操作符

1. “+”作用：数学运算、字符串链接，任何数据类型加字符串都等于字符串
2. - * /
   var a = 0 / 0； //答案是 NaN，应该得出一个数字类型的数，但是没法表达，
   就用 NaN (NaN 是 Not a Number 非数，不是数，但是是数字类型
3. %，摩尔，模，是取余数的意思
   优先级”=“最弱【赋值符号优先级最低】
4. “++”，“- -”，”+=“，“-=”，“/=“，“*=”，“%=”
   var a =10；document.write(++a );document.write(a); //答案 11；11
   是先执行++，再执行本条语句 document.write(++a)
   例 var a =1；document.write(a ++);document.write(a); //答案 1；2。
   是先执行语句(document.write(a))，再++，所以第一次打印的还是 a，第二次打印 a++后的值
   var a = 1;var b = a-- + – a;document.write(b); //答案 0，先执行–a;此时 a 变成0，然后第一个 a 也变成 0，那么 b = 0-- + --a
   赋值的顺序自右向左，计算的顺序自左向右（按数学来）

比较运算符
1、“>”，”<”，”==”，“>=”，“<=”，”!=”比较结果为 boolean 值
字符串的比较，比的是 ASCII 码（七位二进制 0000000）
var a = “10”>“8”;document.write(a);
//答案 false，不是十和八比，是字符串一零和八比，先用开头的一和八比，比不过就不看第二位了；一样的就拿零和八比

逻辑运算符“&&”，“||”，“!“运算结果为真实的值

“&&”与运算符
两个表达式：先看第一个表达式转换成布尔值的结果是否为真，如果结果为真，那么它会看第二个表达式转换为布尔值的结果，然后如果只有两个表达式的话，只看看第二个表达式，就可以返回该表达式的值了，如果第一位布尔值为 false，不看后面的，返回第一个表达式的值就可以了。

例 var a = 1 && 2; //答案 2，如果第一位 1 为真，结果就为第二位的值 2

如果是三个或多个表达式，会先看第一个表达式是否为真，如果为真，就看第二个表达式，如果第二个也为真，就看第三个表达式（如果为真就往后看，一旦遇到假就返回到假的值），如果第三个是最后一个表达式，那就直接返回第三个的结果

“||”或运算符
看第一个表达式是否为真，如果为真，则返回第一个值，碰到真就返回如果第一个表达式是假，就看第二个表达式，如果第二个是最后一个，就返回第二个的值
真假的说法：全假才为假，有一个真就为真

例 var num = 0 || 3; //答案 3 例 var num = 0 || false; //答案是 false

“!“非运算符，否的意思。
先转成布尔值，再取反
例 var a = ! 123;document.write(a); //答案 false。123 的布尔值是 true，取反是 false
被认定为 false 的值：转换为布尔值会被认定为 false 的值 undefined，null，NaN，“”（空串），0， false

3、三元运算符：表达式?true值1：false值2

typeof 操作符

typeof 能返回的六种数据类型（区分数字类型）number、string、boolean、undefined、object、function

例 var num = {}; console.log(typeof(num)); //泛泛的引入值都返回 object
例 var num = [];console.log(typeof(num)); //泛泛的引入值都返回 object
例 var num = null;console.log(typeof(num)); //答案 null 返回 object，最早是代替空对象的
例 var num = undefined;console.log(typeof(num)); //答案返回 undefined
例 var num = fuction(){};console.log(typeof(num)); // 答案返回 function

类型转换

1 显示转换

数字转换
1）Number(mix) 是想把里面的东西转换成数字
Number(true) -------1；
Number（false）---------0；
Number（null）---------0;
Number(undefined)----------NaN;
Number(abc)----------NaN;
Number(‘123’)---------number;

2）parseInt()
parse 是转化，Int 是整型，整数，目的是把里面转换成整数,从左往右一个一个去判断是否为数字，不是则停止解析。
parseInt(ture) /false----------NaN;
parseInt(‘123ad’)---------123;
parseInt(‘12.33’)---------12;

parseInt(demo ,radix); //radix 是基底的意思（radix 范围是 2-36），是将demo看作dadix进制数转换为10进制数
例 var demo = “3”;
var num = parseInt(demo ,2);
console.log(typeof(num) + “:” + num);
答案显示 number: NaN

例 var demo = “b”;
var num = parseInt(demo ,16);
console.log(typeof(num) + “:” + num);
答案显示 number: 11

3）parseFloat(string)
parseFloat(string)转换成浮点数字，从数字类开始看，看到除了第一个点以外的非数字类为截止，返回前面的数

例 var demo = “100.2abc”;
var num = parseFloat (demo);
console.log(typeof(num) + “:” + num);
答案显示 number: 100.2

字符串转换

1）toString
想把谁转换成字符串，就写成谁.toString，上面是想把 demo 转换成 toString，写成demo.toString

例 var demo = undefined;
var num = demo.toString();
console.log(typeof(num) + “:” + num);
答案显示报错，undefined 和 null 不能用 toString

toString(radix) 这里的 radix 意思是以十进制为基底，转换成目标进制（即 8 进制）

例 var demo = 10;
var num = demo.toString(8);
console.log(typeof(num) + “:” + num);
答案 12

2)String(mix)
String(mix)转换成字符串，写什么都成了字符串

例 var demo = 123.234;
var num = String (demo);
console.log(typeof(num) + “:” + num);
答案显示 string: 123.234

例 var demo = undefined;
var num = String (demo);
console.log(typeof(num) + “:” + num);
答案显示 string: undefined

boolean转换
Boolean()转换成布尔值 false 和 true
特殊转换：true,任何非空字符串，任何非0值，任何对象 转换后布尔值都是true
false，空字符串，0，NaN，null，undefined 转换后布尔值为false。

2 隐式转换

隐式类型转换是跟你转换了也不知道，隐式类型转换内部隐式调用的是显示的方法
隐式类型转换包括 isNaN () ，++，–， +/-（一元正负），+，乘，% ，，&&，|| ，！，<，>，<= ，>= ，== ，!=

1）isNaN ();
isNaN ();当你把一个数放到()里，它能判断是不是 NaN，先比括号里面的放到 number里面转换，然后返回来

2）++/–（加加减减） -（一元正负） % Number转换*
例 var a =+”abc”;
console.log(a + “:” + typeof(a));
答案 NaN:number。尽管转换不成数字，也会转换成数字类型，因为里面隐式的调用了一个 number

3）+ 隐式类型会转换成 string，当加号两侧有一个是字符串，就用调用 string，把两个都变成字符串

4）&& || ！
与或非，都是有类型转换的，不过是返回的是表达式的值，不是隐士类型转换的值，但是判断是一个类型转换的布尔值

5） < > <= >=
例 var a =1 > “2”; console.log(a + “:” + typeof(a));
答案 false:boolean，有数字相比较的，就会隐士类型转换成数字类型

例 var a =”3” > “2”; console.log(a + “:” + typeof(a));
答案这个没类型转换，字符串比较是比较 ASCⅡ编码

6）== !=

不转换类型

=== 和 ！==

条件语句

单分支：
单分支选择结构语法：
if（条件，表达式 返回一个布尔值true/false）{
//如果条件成立，返回的是true
//就执行花括号内的所有语句
}
双分支（二选一）：
双分支语法：
if(条件){
条件成立执行语句
}else{
条件不成立，执行语句2
}
if…else if多分支
多分支语法：
if(条件1){
条件成立，执行语句1
}else if(条件2){
条件成立，执行语句2
}else if(条件3){
条件成立，执行语句3
}…
else{ ----------是可以不用写，根据情况决定是否要写else
条件都不成立，执行语句N
}
switch多分支结构：
switch
语法：
switch(变量){
case 值1：执行语句1；break;
case 值2：执行语句2；break;
…
default: 执行默认语句；
}
break语句出现在switch语句中是防止语句穿透，若没右break，所有的语句都会执行。
default:默认语句，前面所有case全部不匹配的时候才会执行

多个if：只要满足条件，每条都会执行
多个if…else，只要满足一个条件满足，后面就不会执行

循环结构

1. 先验证后循环
1）for
语法：
for(表达式1，表达式2，表达式3){
循环体的内容
}
表达式1：循环变量初始化
表达式2：判断条件- true/false
表达式3：循环变量改变
执行顺序：表达式1，表达式2，循环体，表达式3

for循环多种形式

var i = 1;
        for( ; i < 100; ){
            console.log(i + '')
            i++;
        }

var i = 100;
        for( ; i --; ){
            console.log(i);
        }

2）while
语法：
while(条件){循环体-要执行的循环语句}

2.先循环后验证
不管条件是否成立，先执行一次
do{
循环体的内容
}while(条件判断)

数组

创建数组

1.
1)var myArray = new Array(); //空数组
2)var myArray = new Array(‘a’,‘b’,‘c’); //创建并初始化

2.创建一个定义长度的数组
var myArray = new Array(10); //这里面的10不是数组里面的值，二十规定数组的长度

3.字面量方式创建数组

1) var myArray = []; //空的数组
2) var myArray = [2,3,'字符串‘，’abject‘，numeber，，空]； //初始化的数组

var arr = [,] // 稀松数组，相当于定了两个位置，conlogo 结果是 undefined

var arr = [ ];和 var arr = new Array( );唯一的区别是在 var arr = new Array( );只传了
一个参数的情况下，会被当成长度，并且成为一个稀松数组

添加数据到数组的方法：

1.前面两种初始化以及下表添加
2.myArray[myArray.length] = ‘新添加的数据’；
3.push()方法 ，是添加到数据到数组的末尾

数组常用方法

按可否改变数组分

一、改变原数组（在原来数组基础上去改变）

reverse,sort,push,pop, unshift, shift,splice

按功能分

1）添加数据
1.push()方法 ，添加数据到数组的末尾
2.unshift()方法，添加数据到数组的第一位
2）删除数据
1.pop()方法 ，删除位于数组末位的数据
2.shift()方法 ，删除数组最前位的数据 //arr.shift()
3.splice()方法 ，此方法可以删除任意量的数据
语法：
两参：splice（下标起始位置（包括此位置），删除的位数）；

三参：splice(下标起始位置（包括此位置），删除的位数 ，插入的内容)；如果第二个参数设置为0；则是插入数据，如果为1，则是替换数据。

例 arr.splice(1,1,0,0,0); //意思是从第 1 位起截取 1 位，然后加上 0,0,0 这三个数

例 var arr = [ 1,2,3,4 ];
arr.splice(-1,1); // 这里的-1 是倒数第一位，数组一般的方法都可以带负数

例 添加数组


arr.splice(1,2,3)或者arr.splice(1,2)都是返回截取相应长度的数组

3) 其他

1.sort() //给数组排序（按照从小到大），sort 按 asc 码大小排序的
所以给我们留了个接口函数，如下图：

sort是按asc码排序的
1)必须写两个参数
2）看返回值
1.当返回值是负数时，那么前面的数放在在前面
2.当返回值是正数时，那么后面的数在前面
2.为 0 ，不会改变

传参：第一次 12，10 第二次：12，8 第三次：12，4 第四次：12，18 第五次：10，8…

if（a>b）{return 1;}else{return -1} 简写为 return a-b;
传参为（a，b），记住升序 return a – b ; 降序 return b – a ;

2.reverse() //数组逆转

sort().reverse() //改变排序方式，与原来的相反

二、不改变原数组
1）slice concat,join—>split,toString
2）forEach filter map reduce reduceRight

1.concat()
把后面的数组拼到前面，并成立一个新的数组，不影响之前的两个数组。
arr1.concat(arrr2);

2.toString()
是把数组当做字符串展示出来

var arr = [1,2,3,4,5,6]     
console.log(arr.toString())    //1,2,3,4,5,6

3.slice()
1、如果填两个参数，slice（从该位开始截取，截取到该位）
如 arr.slice(1,2)从第一位开始截取，截取到第二位
2、如果填一个参数，从第几位开始截取，一直截取到最后。
如果 arr.slice(1) ，从第 1 位开始截取，截取到最后一位
3、不写参数就是整个截取数组（把类数组转换成数组的时候经常使用到）

4.join
join 括号里面需要用字符串形式（标准语法规定），就会用加的东西连接起数组
join 里面不传参默认用逗号连接。

join 可逆的东西：**split( ) 但是这个是字符串的方法 **
带参用法：
var str = ‘wererwtvsd’;
str.split(‘w’); // [‘erer’,‘tvsd’]；

var str = ‘1-2-3-4-5-6’;
console.log(str.split(’-’); //[‘1’,‘2’,‘3’,‘4’,‘5’,‘6’]

随机数

Math.random()方法，返回介于 0（包含） ~ 1（不包含） 之间的一个随机数。

var a = Math.random() //返回[0，1)之间的一个随机数

var b = Math.random()*10 // 返回一个[0,10)之间的一个随机数

var c = Math.random()*10 + 10 // 返回一个[10，20)之间的一个随机数

parseInt(): 整数取整
var pars = parseInt(Math.random()*10) //返回一个[0,9]之间的整数

取整方法 Math.round() :四舍五入
Math.floor() : 向上取整
Math.ceil() ：向下取整

var rou = Math.round(2.1) //2
var rou = Math.round(2.5) //3

var flo = Math.floor(2.1) //3

var cei = Math.ceil(2.9) //2

新手入门笔记，很多不足，带批判性阅读
本篇博客部分来自于渡一视频教程的总结以及笔记的整理，仅供学习交流，切勿用于商业用途，如有侵权，请联系博主删除，博主QQ：201429846