简介
对JavaScript基本语法的一个复习的算的上是,太简单的就不写了,重点写一些容易忽视的点
数据类型的转换
如何使用谷歌浏览器,快速的查看数据类型?
字符串的颜色是黑色的,数值类型的蓝色的,布尔类型是红色的,undefined和null是灰色的
转换为字符串类型
- var.toString的方法,用的比较多,但是不能对none和undefine进行转换
- string(var),当none和undefine转化为字符串的时候使用string()可以实现转换
- var + ‘’,通过加空字符串的就可以进行转换为字符串的类型
转换为数值类型
- Number(var)方法,可以把字符串和boolean转化为数字,如果var是含有字母则转化的是nan;boolean如果为true,则会转换为1,否则转化为0
- parseInt(var) :无法把布尔类型类型转化为数值类型,无法转化全部都是字母的var,但是在转换字符串的时候遇到数字字符就会转化为数字,非数字就会返回
-parseFloat(var):转化为浮点数,无法转换boolean的类型,返回的是nan,parseFloat可以转化为小数,parseInt只能转化为整数数字,parseFloat会解析第一个点,当遇到第二个点或者是非数字字符就会返回 - +/- :在变量的前面加上正负号,可以转换boolean类型的,var是含有字母则转化的是nan
转换为布尔类型
- Boolean(var):转化为false的情况:null、undefined、‘’、0、nan;
布尔类型的隐式转换
- 当在条件判断中,和循环判断中会发生隐式的转换
运算符
==和===的区别
==:判断的是变量的值是否相等,数值类型可以和字符串类型进行判断
===:先判断变量的类型是否一致,然后在判断数值是否相等,switch使用的是===的判断方式进行判断的
函数
函数的形式
1:命名函数
// 函数封装
function getSum() {
//argument获取实参
console.log(arguments);
var sum = 0;
for (var i = 0; i <= 100; i++) {
sum += i;
}
}
//调用函数
getSum();
2:函数表达式(匿名函数)
//函数表达式,匿名函数,不能独立存在
var fn= function(){
}
3:自调用函数
// 自调用函数
(function () {
console.log("自调用函数");
})()
函数的argument:获取函数的实参,类似于数组,可以按照数组的形式进行调用,但是不是数组。
函数也是一种数据类型,闭包
//函数表达式,匿名函数,不能独立存在
var fn = function () {
console.log('函数表达式');
}
//函数也是参数
function test (fun) {
//如果没有参数传入就是undefined
fun();
}
test(fn);
对象
对象的创建:
1:对象的字面量的方式进行创建
var student = {
name: '张飞',
age: 18,
sex: '男',
sayHi:function() {
console.log(this.name+'hi');
}
}
student.sayHi();
2:new object()的方式
var hero = new Object();
// 打印不存在的属性输出undefine
hero.name = '黄忠';
hero.weapon = '弓箭';
hero.attack = function (){
console.log(this.name+'攻击');
}
3.自定义构造函数的方式
//自定义构造函数
function Hero(name,weapon,equipment,blood){
this.anme = name;
this.weapon = weapon;
this.equipment = equipment;
this.blood = blood;
this.attack = function(){
console.log(this.name+'攻击');
}
}
var hero1 = new Hero('黄忠','弓箭',['头盔','靴子'],100);
var hero2 = new Hero('刘备','弓箭',['头盔','战甲'],100);
new的执行过程
- 在内存中创建空的对象
- this指向在内存中刚刚创建的对象
- 指向构造函数,在构造函数中设置属性和方法
- 返回当前的对象
this关键字
函数中的this:指的的是window
方法中的this:这个方法所属的对象
构造函数中的this:this指的构造函数中创建的对象
遍历对象和删除对象的属性
for in方式
var student = {
name: '张飞',
age: 18,
sex: '男',
sayHi:function() {
console.log(this.name+'hi');
}
}
student.sayHi();
// for inb遍历对象
for(var key in student){
console.log(key+'------'+student[key]);
}
// 删除属性
delete student.sex;
console.log(student.sex);
Javascript内置对象
Date :是构造函数,使用首先需要通过new Date()来创建日期实例(对象)
// 日期格式化
function formateDate(date) {
if(!(date instanceof Date)) {
console.error("不是日期格式");
return;
}
var year = date.getFullYear();
var month = date.getMonth()+1;
var day = date.getDate();
var hour = date.getHours();
var minute = date.getMinutes();
var second = date.getSeconds();
return year+'-'+month+'-'+day+'-'+hour+':'+minute+':'+second;
}
var d =new Date();
var date1= formateDate(d);
console.log(date1);
计算时间的差值
function getInterval(strat,end) {
var interval = end -strat;
//求解相差的天数/小时数/分钟数/秒数
interval = interval / 1000; //秒数
day = interval /60 /60 /24; //天数
hour = interval /60/60%24; //小时
minute= interval /60%60;
second = interval%60;
return {
day:day,
hour:hour,
minute:minute,
second:second
}
}
数组对象
arr.valueOf()
返回数组对象本身
arr.toString()
把数组转化为字符串,并且使用逗号进行分隔
array.pop()
删除一个数组中的最后一个元素,并且返回这个元素
array.shift()
删除数组的第一个元素,并返回这个元素
array.push(element1, ...elementN)
添加一个或多个元素到数组的末尾,并返回数组新的长度
array.unshift(element1, ...elementN)
在数组的开头插入一个或多个元素,并返回数组的新长度
array.sort([compareFunction(firstEl,secondEl)])
对数组的元素做原地的排序,并返回这个数组。sort可能不稳定,默认按照字符串的unicode码位点排序;
记a和b是两个将要被比较的元素:
- 如果函数function(a, b)返回值小于0, 则a会排在b之前
- 如何函数返回值等于0, 则a和b的相对位置不变(并不被保证)
- 如果函数返回值大于0,则a会排在b之后
- 比较函数输出结果必须稳定,否则排序的结果将是不确定的
array.reverse()
前后颠倒数组中元素的位置,第一个元素会成为最后一个
array.splice(start, deleteCount[, item1[, item2...])
在任意的位置给数组添加或删除任意个元素(拼接),返回被删除的元素组成的数组,没有则返回空数组
array.concat(value1, value2.....)
将传入的数组或非数组值与原数组合并,组成一个新的数组并返回
注意:concat方法在拷贝原数组的过程中,
- 对象引用(非对象直接量):concat方法会复制对象引用放到组合的新数组里,原数组和新数组中的对象引用都指向同一个实际的对象,所以,当实际的对象被修改时,两个数组也同时被修改
- 字符串和数字(是原始值,而不是包装原始值的string和number对象):concat方法会复制字符串和数字的值放到新数组里
var arr1 = [1, 2, {a: 'test'}]
var arr2 = ['a', 'b', 'c']
var output = arr1.concat(arr2)
console.log(output) // output[2].a == 'test'
setTimeout(function(){
arr1[2].a = 'has changed'
console.warn(output) //output[2].a == 'has changed'
}, 5000)
array.join([separator = ','])
将数组中的所有元素连接成一个字符串(默认用逗号作为分隔符,如果separator是一个空字符串,那么数组中的所有元素将被直接连接)
如果元素是undefined或者null,则会转化成空字符串
array.slice([begin = 0 [, end = this.length - 1]])
把数组中一部分的浅复制(shallow copy)存入一个新的数组对象中,并返回这个新的数组
不修改原数组,只会返回一个包含了原数组中提取的部分元素的一个新数组
array.indexOf(searchElement[, fromIndex = 0])
返回指定元素能在数组中找到的第一个索引值,否则返回-1
fromIndex可以为负,表示从倒数第n个开始(此时仍然从前向后查询数组)
使用“严格相等”(===)进行匹配
字符串对象的常用方法
注意字符串的方法是字符串对象的方法
substring()
方法返回一个字符串在开始索引到结束索引之间的一个子集, 或从开始索引直到字符串的末尾的一个子集。
var anyString = "Mozilla";
console.log(anyString.substring(0,3)); //Moz
console.log(anyString.substring(3,0)); //Moz
charAt()
方法从一个字符串中返回指定的字符。在HTML5中等价于str[0]
console.log('hello'.charAt(3)) //l
charCodeAt()
查找字符串下标并返回unicode 值序
console.log("ABC".charCodeAt(0)) // returns 65
concat()
方法将一个或多个字符串与原字符串连接合并,形成一个新的字符串并返回。
let hello = 'hello';
console.log(hello.concat(' word','!')); //hello word!
replace()
匹配元素替换,只会替换第一个字符
console.log('hi word'.replace('hi','hello')) //hello word
替换所有的元素
var index=-1
do {
index=s.indexOf('o',index+1);
if(index!=-1){
//替换
s=s.replace('o','!');
}
}while(index !=-1)
trim()
去除字符串两边的空格
console.log(' hello '.trim()); //hello
如何去除字符串之间的空格呢?可以使用replace