210405javascript

//弱类型特性

数据类型
原始类型：number string boolean null undefined
对象类型：object

隐式转换

巧用+，-

javascript是一种运行在浏览器中的解释型编程语言
web世界里，只有js能跨平台，跨浏览器驱动网页，与用户交互。
新兴的nodejs把js引入到服务器端。

<script type="text/javascript">
  //type的默认值是javascript
</script>

运行JavaScript方式：
必须有一个HTML页面，在HTML页面中引入JavaScript，让浏览器加载HTML页面，就可以执行JavaScript代码。
特别的：
直接打开新建的包含JavaScript的html页面有时候会有问题，由于浏览器的安全限制，以‘file://’开头的地址无法执行如联网等JavaScript代码，还需要架设一个web服务器，以‘http://’开头的地址正常执行所有代码。

目前最主流的三个Web服务器是Apache、 Nginx 、IIS。

javascript区分大小写

数据类型

1.Number
以下都是合法的Number类型
123;0.256;1.235;-99;NaN;Infinity;

2.字符串
1.以单引号和双引号括起来的任意文本，双引号和单引号是一种表示方式，不是字符串的一部分。例如‘abc’只有‘a’,'b','c'这3个字符。
2.字符串中包含引号时候，用转义字符\转义即可
3.多行字符串使用反引号 ``（反引号在键盘的ESC下方，数字键1的左边）
4.模板字符串
多行字符串拼接包含变量时 var message = 你好, ${name}, 你今年${age}岁了!;
5.字符串是不可变的，若对字符串的某个索引赋值，不会有报错也没效果，字符串的一些方法不会改变原有字符串的内容而是返回一个新字符串

var s = 'Hello';
var lower = s.toLowerCase();// hello  转小写
var upper = s.toUpperCas();//HELLO 转大写
s.indexOf('o');// 4  搜索指定字符串出现的位置 索引从0开始
s.substring(0,2)//He  从0开始到2，不包含2
s.substring(0)//Hello从0开始到最后

3.布尔值
只有true false两种值
相等运算符有两种：

1. == 自动转换数据类型再比较，会得到诡异的结果
2. === 不会自动转换数据类型，类型不一致，返回false,类型一致，再比较。

NaN === NaN // false NaN和任何值都不相等
isNaN(NaN)//true 只能通过isNaN()这种方式判断
1/3 === (1 - 2/3); //false 浮点数运算过程中会产生误差，因为计算机无法精确表示无限循环小数。
//若比较两个浮点数，只能计算他们之差的绝对值是否小于某个阈值
Math.abs(1/3 - (1 - 2/3)) < 0.0000001//true

4.null和undefined
null表示一个‘空’的值，表示‘空’
0：是一个数值
‘’：长度为0的字符串
undefined:表示未定义，仅仅在判断函数参数是否传递的情况下有用

5数组
是一组按顺序排列的集合，集合的每个值称为元素。数组可以包括任意数据类型

//slice()对应字符串中的substring()方法，截取数组中的元素
var arr = ['A', 'B', 'C', 'D', 'E', 'F', 'G'];
arr.slice(0,3)// 从0开始，到3结束，不包括3，返回['A', 'B', 'C']
//splice()修改数组的万能方法，从指定索引开始删除若干元素，从该位置添加若干元素
var arr = ['Microsoft', 'Apple', 'Yahoo', 'AOL', 'Excite', 'Oracle'];
arr.splice(2,3,'newadd1')// 从索引2开始删除3个元素，在索引2处添加newadd1  返回['Yahoo', 'AOL', 'Excite']
arr//['Microsoft', 'Apple', 'newadd1', 'Oracle'];

6对象
是一组由键值组成的无序集合，键都是字符串类型，值可以是任意类型。例如下面
var person= {
name:'aa',
age:20,
tags:['js','web'],
zipcode:null
}
要过滤掉对象继承的属性，用hasOwnProperty()来实现：

var o = {
    name: 'Jack',
    age: 20,
    city: 'Beijing'
};
for (var key in o) {
    if (o.hasOwnProperty(key)) {
        console.log(key); // 'name', 'age', 'city'
    }
}

es6中心的数据类型Map,是为了解决对象中键必须是字符串，数字和其他类型不能做为键的问题。
Map是一组键值对的结构，具有极快的查找速度。
初始化Map需要一个二位数字，或者直接初始化一个空的Map
Set是一组key的集合，不存value，由于key不能重复，故set中没有重复的key,需要提供一个array作为输入，或者创建一个空的set

//查找某个同学的成绩，先找到名字，再根据名字位置找到分数，数组越大耗时越长
var names = ['Michael', 'Bob', 'Tracy'];
var scores = [95, 96, 97];
//map实现方式
var m = new Map([['Michael',95],['Bob',96],['Tracy',97],]);
m.get('Michael')//95
console.log(m)//{"Michael" => 95, "Bob" => 96, "Tracy" => 97}
//map的方法
var m = new Map();
m.set('aa',67)//添加值
console.log(m)//{"aa" => 67}
m.has('aa')//是否存在  true
m.get('aa')// 获取值 67
m.delete('aa')//删除 aa
var s = new Set([1, 2, 3, 3, '3']);
s; // Set {1, 2, 3, "3"} 重复元素在set中自动过滤
s.add(4)//添加元素
s.delete(4)//删除元素

遍历map和set的方法是 for(var x of map)，更好的方式是iterable的内置forEach方法,接收一个函数，每次迭代自动回调该函数

//for in循环的历史遗留问题：会把自定义添加的属性遍历出，但length属性却不包括在内。
var a = ['A', 'B', 'C'];
a.name = 'Hello';
for (var x in a) {
    console.log(x); // '0', '1', '2', 'name'
}
a.forEach(function (element, index, array) {
    // element: 指向当前元素的值
    // index: 指向当前索引
    // array: 指向Array对象本身
    console.log(element + ', index = ' + index);
});

变量
命名规则：英文字母，数字，$,_,不可数字开头，不可包含关键字（if,while）
赋值 ：x = x + 2,先执行x+2 再执行赋值
strict模式 ：强制通过var申明变量，未使用var申明变量就使用的，将导致运行错误。
启用strict模式的方法是在JavaScript代码的第一行写上 'use strict';

函数体内部的语句在执行时，一旦遇到return时，函数执行完毕，并将结果返回。若没有return语句，执行完也会返回结果，只是结果是undefined。return返回多行结果时，js引擎在行末自动添加分号机制，会有个坑

//错误写法
function foo() {
    return; // 自动添加了分号，相当于return undefined;
        { name: 'foo' }; // 这行语句已经没法执行到了
}
//正确写法
function foo() {
    return{ // 这里不会自动加分号
        name: 'foo' 
      }; 
}

函数传参：由于可以传任意个参数即使用不到，所以取所有的参数的方法 rest参数只能写在最后，前面用...标识

function foo(a,b,...rest){
  console.log(a);
  console.log(b);
  console.log(rest);
}

foo(1,2,3,4,5)
//a=1
// b=2 
//[3,4,5]

解构赋值：可以同时对一组变量进行赋值
对象结构赋值：保证对应层次一制

var [x, y, z] = ['hello', 'javascript', 'es6'];
console.log(x)//hello
let [,, z] = ['hello', 'javascript', 'es6']
console.log(z)//es6  前面参数可以忽略
let person = {
  name:'tt',
  age:20,
  address: {
    city:'beijing',
    street:'No.1 road'
  }
}
var {name, address:{city,street}} = person
console.log(city)//beijing  address不是变量，只是为了让city获得嵌套的属性
var {name,age:id} = person
console.log(id)// 20  age不是变量，为了让id获得age的属性
console.log(age) //  Uncaught ReferenceError: age is not defined
//给对象新添加一个带默认值的属性
var {name, single = true} = person;
console.log(single)//true
//给对象已有的变量再次赋值
// 声明变量:
var x, y;
// 解构赋值:
({x, y} = { name: '小明', x: 100, y: 200})

apply()改变this指向，两个参数，
第一个是需要绑定的this变量，
第二个是array，表示函数本身的参数

function getAge() {
    var y = new Date().getFullYear();
    return y - this.birth;
}

var xiaoming = {
    name: '小明',
    birth: 1990,
    age: getAge
};

xiaoming.age(); // 25
getAge.apply(xiaoming, []); // 25, this指向xiaoming, 参数为空

call() 与apply()区别，传参数一个一个传

Math.max.apply(null, [3, 5, 4]); // 5
Math.max.call(null, 3, 5, 4); // 5