JavaScript的基本语法

简介
对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的执行过程

  1. 在内存中创建空的对象
  2. this指向在内存中刚刚创建的对象
  3. 指向构造函数,在构造函数中设置属性和方法
  4. 返回当前的对象

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

你可能感兴趣的:(JavaScript的基本语法)