strict模式

在strict模式下运行的代码，强制通过var声明变量，未使用var的则导致系统运行错误。

  • 启用strict模式的方法：在js代码的第一行写：'use srict';
  • 测试：
'use strict';
var a="111";
alert(a);

如果报错说明浏览器支持。

js浮点数的比较

因为计算机无法精确表示无限循环小数，比较两份浮点数只能比较他们是否小于某个阈值

console.log(Math.abs(1/3-(1-2/3))<0.0000001);

运行结果是true

比较运算符==与===

== 他会转换数据类型在比较，很多时候，会得到非常诡异的结果

===不会自动转换数据类型，如果数据类型不一致，返回false,如果一致在比较。

比\n牛x多了的符号—多行字符串的的表示方法``

由于多行字符串用\n写起了比较费劲，根据最新的ES6标准用 `xxxxx`

  • 例如：
console.log(`张三
李四
王麻子`);

输出结果：

张三
李四
王麻子

字符串

获取字符串某一个指定位置的字符

使用类似于Array的下标操作

  • 测试：
var s="hello world!";
console.log(s[0]);

结果：h

超出范围的索引不会报错，返回的是undefined

需要特别注意的是字符串是不可变的，如果对字符串的某个索引赋值，不会有任何错误，但是也没有任何效果。

var s="hello world";
s[0]='H';
console.log(s);

hello world
字符串变大写-toUpperCase
var s="hello world";
console.log(s.toUpperCase());

结果：HELLO WORLD
字符串变小写-toLowerCase
var s="HELLO WORLD";
console.log(s.toLowerCase());

结果：hello world
指定字符出现的位置-indexOf
var s="hello world";
console.log(s.indexOf("l"));

结果:2

如果指定字符在字符串中出现的次数不只一次。则返回第一次出现的位置。

var s="hello world";
console.log(s.indexOf("W"));

结果：-1

如果没有出现则返回-1

字符串截取 substring()

var s='hello world';
console.log(s.substring(0,5));

结果：hello

返回0-5 （但不包含5）

var s='hello world';
console.log(s.substring(7));

orld

从索引7开始

数组

js数组可以包含任意数据类型，并通过索引来访问每个元素。

获取Array的长度—arr.length
var s=[1,true,'字符串',null];
console.log(s.length);

结果：4

请注意： 直接给数组赋予一个新的长度会使数组大小发生改变。

var s=[1,true,'字符串',null];
s.length=6;
console.log(s);

结果：[ 1, true, '字符串', null, undefined, undefined ]
修改数组元素的值

通过索引来进行修改。

var s=['A',123,"C"];
s[1]='234';
console.log(s[1]);

234

**请注意：**如果通过索引赋值时，索引超过范围，会引起Array大小的改变。

var s=['A',123,"C"];
s[4]='234';
console.log(s);

 结果:["A", 123, "C", undefined, "234"]
搜索指定元素的位置—indexOf()
var s=[10,20,30,'30'];
console.log(s.indexOf(30));
console.log(s.indexOf('30'));

2
3

注意'30'和30是不同的。

数组截取—slice（相当于字符串的substring()）
var array=['A','B','C'];
console.log(array.slice(1,2));//从1开始到2（但不包含2）

结果：[ 'B' ]

注意： 截取数组得到的一定是数组

var array=['A','B','C'];
console.log(array.slice());

[ 'A', 'B', 'C' ]

注意： 如果不给slice任何参数,则截取整个数组。利用这一点可以很容易复制一个数组。

数组追加元素（push）及删除末尾元素（pop）

push:向末尾追加若干元素；

var array=['A','B','C'];
array.push('2',3);
console.log(array);

结果:[ 'A', 'B', 'C', '2', 3 ]

pop：删除数组最后的元素。

var array=['A','B','C'];
array.pop();//第一次删除
console.log(array);
array.pop();第二次删除
console.log(array);
array.pop();//第三次删除
console.log(array);

结果：[ 'A', 'B' ]
      [ 'A' ]
      []

如果数组为空，执行pop也不会报错，只是返回一个空数组。

数组头部插入元素（unshift）及删除头部元素（shift）

unshift：数组头部插入元素。

var s=['A','B','C'];
s.unshift('23',true,null);
console.log(s);

结果：[ '23', true, null, 'A', 'B', 'C' ]

shift：删除头部的元素。

var s=['A','B','C'];
s.shift();
console.log(s);

结果：[ 'B', 'C' ]
数组排序—sort
  • 按照字母排序：
var s=['B','C','A'];
s.sort();
console.log(s);

结果：[ 'A', 'B', 'C' ]
  • 按照数字排序
var s=[2,1,3];
s.sort();
console.log(s);

结果：1,2,3
  • 数字和数字字符串混搭也可以排序
var s=['2',1,'3'];
s.sort();
console.log(s);

结果：[ 1, '2', '3' ]
  • 如果有很多种字符则按照ASCII码进行排序（猜测）
var s=['Z',':','}'];
s.sort();
console.log(s);

结果：[ ':', 'Z', '}' ]
反转reverse
var s=['A',23,null];
s.reverse();
console.log(s);

结果：[ null, 23, 'A' ]
修改数据的万能方法—splice
  • 定义： 可以从指定的索引开始删除若干元素，然后从该位置添加若干元素
  • 用法：splice(位置,删除个数,添加的内容);
    • 删除元素，并添加元素：
    var s=['A','B','C'];
s.splice(1,2,'Google','BaiDu');
console.log(s);

      结果：[ 'A', 'Google', 'BaiDu' ]
    • 只删除不添加：
    var s=['A','B','C'];
s.splice(1,2);
console.log(s);

      结果：[ 'A' ]
    • 不删除只添加：
    var s=['A','B','C'];
s.splice(1,0,'Google','BaiDu');
console.log(s);

      结果：[ 'A', 'Google', 'BaiDu', 'B', 'C' ]

    不删除删除个数设置为0就行。

数组合并—concat
var a=['A','B','C'];
var b=[1,2,3];
console.log(a.concat('@','$',b));

结果：[ 'A', 'B', 'C', '@', '$', 1, 2, 3 ]

a和b连接，并形成一个新的数组。

数组用指定字符连接起来并返回字符串—join
var s=[1,2,'C'];
console.log(s.join('-'));

结果：1-2-C

如果数组元素不是字符串则先转换我字符串在拼接起来。

对象

var xiaoming={
    name:'小明',
    birth:1990,
    'middle-school':'NYZ NO1 middle school'
}
获取某一属性：
  • 正常访问：
console.log(xiaoming.name);
console.log(xiaoming['middle-school']);//属性名中包含特殊字符

结果：小明
  • 如果属性名中包含特殊字符，则用[''];
  • JavaScript所有对象的属性都是字符串，不过属性对应的值可以是任意类型。
  • 如果属性不存在：则返回undefined
console.log(xiaoming.age);

结果：undefined
添加属性与删除属性：
  • 添加属性：
xiaoming.age=18;
console.log(xiaoming.age);

结果：18;
  • 删除属性：
delete xiaoming.age;
console.log(xiaoming.age);

结果：undefined

删除一个不存在的属性也不会报错；

判断对象是否包含某个属性—in与hasOwnProperty()
  • in：判断某个属性是否属于这个对象，包含继承过来的对象。
    console.log('name' in xiaoming);//自身的对象
console.log('toString' in xiaoming);//继承过来的对象

      结果:true
       true
  • hasOwnProperty() ：判断某个属性是否属于这个对象，不包含继承对象。
    console.log(xiaoming.hasOwnProperty('name'));//自身的对象
console.log(xiaoming.hasOwnProperty('toString'));//继承过来的对象

      结果：true
      false
JavaScript对false的定义：null，undefined、NaN，0和空字符串都为false
for...in

循环出xiaoming对象的所有属性：

for(var s in xiaoming){
    console.log(s);
}

结果：name
     birth
     middle-school

由于数组也是对象，而他每个元素的索引被视为属性则如下：

var arr=['A','B','C'];
for(var s in arr ){
    console.log(s);
    console.log(arr[s]);
}

结果：0
     A
     1
     B
     2
     C

注意： for...in对数组的循环得到的是String而不是字符串。

Map

背景： javaScript中的对象类似于其他语言中的Map，但是可但是javaScript总的对象不能以Number作为属性值。为了解决这个问题ES6引入新的数据类型：map。

定义：

  • var m=new Map(二维数组);//放入一个二维数组
var m=new Map([['张三',56],['李四',45]]);//
console.log(m.get('张三'));

结果：56
  • var m=new Map();//初始一个空的 ,用set添加一个属性
var m=new Map();
m.set(1234567,'张三');
console.log(m.get(1234567));

结果：张三
  • 添加一条数据-set
var m=new Map();
m.set(1234567,'张三');
console.log(m.get(1234567));

结果：张三
  • 删除一条数据-delete
var m=new Map();
m.set(1,'张三');
m.set(2,'李四');
m.delete(2);
console.log(m.get(2));

结果：undefined
  • 判断一个map中是否包含某个key-has
var m=new Map();
m.set(1,'1');
m.set(2,'2');
m.set(3,'3');
console.log(m.has(1));
console.log(m.has(4));

结果：true
    false

set

set和map类似但是不存在value。

定义：

  • var set=new Set();//设置一个空的set
var set=new Set();
set.add(2);
set.add('3');
console.log(set);

结果：Set { 2, '3' }
  • 利用一维数组：var set=new set(一维数组);
var set=new Set([2,3,null]);
console.log(set);

结果：Set { 2, 3, null }
  • 删除元素-delete
var set=new Set(['12',12]);
set.delete(12);
console.log(set);

结果：Set{'12'}

iterable类型

Array、Map、Set属于iterable类型。iterable类型可以用for...of来遍历。用法如下：

  • 遍历set
var set=new Set(['A','B','C']);
for(var s of set){
    console.log(s);
}

结果：A
     B
     C
for...of与for...in区别
  • for...in由于历史遗留问题，他遍历的实际是属性的名称。
    • 一个数组实际上是一个对象，他的元素的索引是属性。当;我们手动给数组添加一个属性,for...in就会得到意想不到的结果。如下例子:
      var array=['A','B','C'];
array.name='arrayName';
for(var a in array){
console.log(a);
}
console.log(array.length);

        结果：0
      1
      2
      name
      4

      循环将把意外添加的属性也循环出来。但是长度中又不包含name，你说矛盾不，矛盾不。这就是引入for...of的原因。

iterable最好的循环方式-forEach
  • Array
var s=['a','b','c'];
forEach(function(element,index,array){
    console.log(element);//element： 指向当前元素的值
    console.log(index);//index：指向当前索引
    console.log(array);//array： 指向array对象本身
})

结果：
a
0
[ 'a', 'b', 'c' ]
b
1
[ 'a', 'b', 'c' ]
c
2
[ 'a', 'b', 'c' ]
  • Set
var set=new Set(['A','B','C']);
set.forEach(function(element,index,set){
    console.log(element);//element： 指向当前元素
    console.log(index);//index：指向当前元素
    console.log(set);//array： 指向set本身
});

    结果：
    A
    A
    Set { 'A', 'B', 'C' }
    B
    B
    Set { 'A', 'B', 'C' }
    C
    C
    Set { 'A', 'B', 'C' }
  • Map
var map=new Map([['张三',18],['李四',16],['王麻子',56]]);
map.forEach(function(value,key,map){
    console.log(value);//element： 指向当前值
    console.log(key);//index：指向当前键
    console.log(map);//array： 指向map本身
});

    结果：
    18
    张三
    Map { '张三' => 18, '李四' => 16, '王麻子' => 56 }
    16
    李四
    Map { '张三' => 18, '李四' => 16, '王麻子' => 56 }
    56
    王麻子
    Map { '张三' => 18, '李四' => 16, '王麻子' => 56 }
  • JS不要求参数必须一致-因此可以忽略一些不比较的参数
var map=new Map([['张三',18],['李四',16],['王麻子',56]]);
map.forEach(function(value){
    console.log(value);//value： 指向当前值
});

    结果：
    18
    16
    56

现在有一个问题只能输出值，而不能输入index或者array

函数

任何函数都有返回值

如果没有return或者return的为空，则返回undefined

函数也是对象

所以可以把函数赋值给变量，例如：

var a=function(x){
    if(x>=0){
        return x;
    }else{
        return -x;
    }
}
console.log(a(1));

结果：
1
JS允许传入任意多个参数，多少都行

例如：

var a=function(x){
    if(x>=0){
        return x;
    }else{
        return -x;
    }
}
console.log(a());

结果：NaN

如果没有传入参数：则默认参数为undefined

关键字 arguments-单词论据的意思
  • 它只在函数内部起作用
  • 它永远指向传入的所有参数
  • 它类似于array但不是array
    例如：
function foo(x){
console.log(arguments);
for(var i=0;i<arguments.length;i++){
console.log(arguments[i]);
}
}
foo(10,20,30);

结果：
{ '0': 10, '1': 20, '2': 30 }
10
20
30
  • 它常用于判断参数的个数
    例如：foo(a[,b],c)b是可选参数。//接收2-3个参数，b是可选参数。如果只传2个参数，b默认为null来遍历。用法如下：
关键字获取参数以外的参数-rest

定义：...rest

function foo(a,b,...rest){
console.log(a);
console.log(b);
console.log(rest);
}
foo(1,2,3,4,5);
函数的变量作用域-内部函数访问外部函数定义的变量

方法：函数是可以嵌套的。
例如：

function foo(){
var x=1;
function bar(){
    var y=x+1;
    console.log('结果'+y);
}
bar();
}
foo();

结果：2

外部函数不可以访问内部函数定义的变量。

函数-变量置顶

变量置顶：指的是提升变量的声明、声明、声明而不是赋值。

全局作用域
  • JavaScript有一个默认的全局对象window
  • 全局作用域的变量实际上被绑定到window的一个属性上
  • JavaScript实际上只有一个全局作用域，只有一个，只有一个，任何变量（函数、函数、函数也视为变量）、
'use strict';
var course='Learn JavaScript';
alert(course);
alert(window.course);

注意：一定要用alert不要用console，用console执行不成功，不知道为什么；

大胆尝试