JavaScript基础
JS的基本数据类型
数值类型
parseInt():把字符串中的数据转换成数值
例：parseInt('123') parseInt('2.34')的值为2，此方法从转边开始检查，碰到不认识的字符就停止，所以值为2
例：parseInt('100',2) 将‘100’按2进制转换成10进制的值 为4，parseInt('100',8) 值为64，parseInt('100',undefined)值为100
toString():转成字符串
isFinite()：判断是否为数字
isNaN():判断是否为非数字
parseFloat():转换成小数
布尔类型
true 和false
以下6种方式全为flase：undefined, null, false, 0, NaN, ""或""(空字符串)
字符串类型
用单引号或双引号表示；多行字符串用 \n相连；ES6标准用反引号,用+拼接
例：var hello = `hi, i am yhy`
引用变量：用$来引用
`${hello}`
hello.charAt(n):取hello中第n个字符
字符串接接：'a'+'b'+'c'
hello.indexof('h'):返回h所在的位置，没找到返回-1； indexof('i',2) 从第2个位置起查找
hello.lastIndexof('h'):从最后边开始查找
hello.slice(1,9): 取hello中第一个到第9个的值
hello.split('i'): 以i来分割字符串，得到的值中不包括i
hello.toLowerCase():把字符串转换成小写
hello.toUpperCase():把字符串转换成大写
hello.includes():返回布尔值，表示是否找到了参数字符串 hello.includes('hello')
hello.startsWith() hello.endsWith()
hello.repeat(n):字符串重复n次
hello.padEnd(n,'xxx'):在字符串后补充xxx来凑够n位
hello.padStart(n,'xxx'):在字符串前补充,第二个参数省略的话用空格补充
内置类型之null与undefined
null 值为空，有类型，是一个对像不是全局标识符
undefined 未定义，没有类型；是全局标识符
null === undefined false 三个=号即比较内容又比较类型
null == undefined true 两个=号比较内容
！null true
isNaN(1+null) false 1加上一个空后变为有值，是一个数字类型，所以为false
isNaN(1+undefined) true 1加上一个未定义类型后有值 ，但没有类型，所以为true
symbol类型
一种新的类型，得到一个唯一的值，不会被轻易的改掉
let s=Symbol() ES6之后用let定义变量名
ES6的类数组array-like对象
声明：var alist=[],添加元素alist[索引]=元素
特性：可以存不同的数据类型，数组长度可变，索引可以是数字也可以是字符串，可以多层嵌套
长度：可变
方法：concat()连接数组,返回一个值；join()将数组元素连接起来形成一个字符串，pop()删除并返回该元素，push()添加元素，reverse()倒序数组，shift()移出元素
slice()返回数组的一部分，sort()排序；splice()插入，删除或替换元素，unshift()在头部插入元素
var aList = []
undefined
var aList = [1,2,3,4,5]
undefined
aList
Array(5) [ 1, 2, 3, 4, 5 ]
typeof aList
"object"
aList.name='yhyang'
"yhyang"
aList
(5) […]
0: 1
1: 2
2: 3
3: 4
4: 5
length: 5
name: "yhyang"
<prototype>: Array []
aList.length
5
aList.age=18
18
aList.length
5
aList.length=3
3
aList
Array(3) [ 1, 2, 3 ]
delete aList["name"]
true
aList
Array(3) [ 1, 2, 3 ]
delete aList[0]
true
aList
Array(3) [ <1 empty slot>, 2, 3 ]
aList = []
Array []
a
ReferenceError: a is not defined[详细了解] debugger eval code:1:1
aList =[[1,2,3],[4,5,6],[7,8,9]]
Array(3) [ (3) […], (3) […], (3) […] ]
aList
(3) […]
0: Array(3) [ 1, 2, 3 ]
1: Array(3) [ 4, 5, 6 ]
2: Array(3) [ 7, 8, 9 ]
length: 3
<prototype>: Array []
aList[1][1]
5
ES6的object对象
概念：无序的集合，由若干个键值对组成；对象是属性的容器每个属性有k,v；对象是无类型的，可以嵌套，属性可以动态添加，属性都是字符串
创建：var obj_a = {} typeof obj_a obj_a.name = 'yhyang' 当key为关键字时obj_b["for"] = 'test',key默认不允许带-号
可以这样obj_b["aaa-bbb"] = 'test'取值的时候也用[""]来取
对象的引用，不会被复制：a = b a与b用的是同一份内容
prototype是标配对象：委托：属性通过原型链往上查找，Object.prototype没有的属性会产生undefined 如：obj_a.book这里book是一个不存在的属性，
查找时会一层层的向上查找Object.prototype查找不到时显示undefined
属性判断hasOwnProperty:不检查原型链
删除：delete
全局变量：命名空间，唯一使用，灵活可靠
this 关键字
直接被调用的函数，this为全局对象
被某个对象调用的函数，this为当前对象
var obj_this = {name:'yhyang'}
obj_this.doSomeThing = function(){
console.log(this); //此处的this为对象obj_this调用，所以值为name:'yhyang'
var that = this;
function test(){
console.log(this); //此处this为全局this
console.log(that);
}
test();
}
obj_this.doSomeThing();
function hello(){
console.log(this); //此处this为全局this
obj = {}
obj.f = function test(){
console.log(this); //此处this为对象f的this，所以值为f
}
obj.f();
}
hello();
函数
函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块。
JavaScript 函数语法
函数就是包裹在花括号中的代码块，前面使用了关键词 function：
function functionname()
{
这里是要执行的代码
}
函数表达式
JavaScript 函数可以通过一个表达式定义。
函数表达式可以存储在变量中：
var x = function (a, b) {return a * b};
在函数表达式存储在变量后，变量也可作为一个函数使用：
var x = function (a, b) {return a * b};
var z = x(4, 3);
作用域
块级作用域
function f5(){
let n = 5;
if(true){
let n=10;
}
console.log(n);
}
f5();
此时打印的值为5，let定义的n=5 n=10分属于两个块
function f10(){
var n=5;
if(true){
var=10;
}
console.log(n);
}
f10();
此时打印10，当变量用var定义时，后边的会把前边的的覆盖，var n=10会提升到var n=5的位置。
function foo(){
const a=true;
function bar(){
const a=false;
console.log(a);
}
bar();
console.log(a);
}
foo();
在不同的块中，同名的const变量可以重新赋值
var tmp = new Date();
function ff(){
//var tmp;
console.log(tmp);
if(false){
console.log(tmp);
var tmp='hello';
}
}
ff();
上例中第一个console.log(tmp)会打印undefined，原因是最后边的var tmp='hello'会提升到function的下边变成var tmp，只是定义，没有值，所以会打印undefined
//var的for循环
var s='hello';
for(var i=0;i<s;i++){
console.log(s[i]);
}
i;
会打印i的值为5，把var换成let可让i只在for内部使用，i的值变为is not defined
闭包
定义在函数内部的函数，作用为读取函数里面的变量
function createIncrementor(start){
return function (){
return start++;
};
}
var inc = createIncrementor(5);
console.log(inc());
console.log(inc());
console.log(inc());
console.log(inc());
5的值会累加
箭头函数
定义语法： =>
支持表达式模式和语句模式
var f = v => v;
// 相当于下边
var f = function (v) {
return v;
};
如果箭头函数不需要参数或需要多个参数，就使用一个圆括号代表参数部分
var f = () => 5;
var f = function () {return 5;};
var sum = (num1,num2) => num1 + num2;
var sum = function(num1,num2){return num1 + num2;};
代码块部分多于一条语句要用{}括起来并且要有return 语句返回
[,'A'].forEach((x,i) => console.log(i)); // forEach方法 x,i对应前边数组的下标
[7,'A'].forEach((x,i) => console.log(i));
[7,'A'].forEach(i => console.log(i));
['a',,'b'].filter(x =>true);
[1,2,3,4,5].filter(x => x>2);
[,'a'].every(x => x==='a');
[1,2,3,4,5].every(x => x>2);
[1,,2].reduce((x,y) => x+y);
[,'a'].some(x=>x !=='a')
[,'a'].map(x=>1);
[1,2,3,4,5].map(x => x*2);
箭头函数作用域
和父作用域具有一样的this,绑定定义时所在的作用域
箭头函数根本没有自己的this，导致内部的this就是外层代码块的this
function Timer(){
this.s1 = 0;
this.s2 = 0;
setInterval(() => this.s1++, 1000);
setInterval(function(){
this.s2++;},1000);
}
var timer = new Timer();
setTimeout(() => console.log('s1:',timer.s1),3100);
setTimeout(() =>console.log('s2:',timer.s2),3100);
JavaScript基础
ES6的数据结构 Set与Map
Map 是一级键值对的结构，按插入顺序排列 const map= new Map() cm.set('name','yhyang')
相关方法:set添加，delete删除，get获取值，size查看大小,forEach遍历内容，clear清空，keys查看键，values查看值
Set 也是一组key的集合，存储唯一的值 var s1 = new Set() s1.add(1) s1.add(2)
相关方法：add 添加，delete删除，has判断有没有值，clear清空，size大小
©著作权归作者所有：来自51CTO博客作者yhyang的原创作品，如需转载，请注明出处，否则将追究法律责任