2019.6.22 Web全栈开发 学习笔记(十一)

JavaScript Day 4

上课日期:2019年8月8日

课程内容

一、JavaScript中字符串的常规方法

  1. 字符串定义
    直接使用var就可以定义字符串var s="123"; var b="456";
  2. 字符串的拼接
    直接使用“+”号或者concat可以将两个或多个字符串拼接在一起
console.log(s + b);
console.log(s.concat(b));

这两种都可以输出将字符串s和字符串b拼接起来的内容

  1. indexOf寻找字符
    首先定义一个字符串var str="a,b,c,def,ga";
    使用indexOf可以输出从左到右该字符所在的位置,例如
console.log(str.indexOf("a"));

输出结果为0

console.log(str.indexOf("e"));

输出结果为4(字符串中的“,”也算位置)

同理,lastindexOf也可以寻找字符,不同的是lastindexOf的顺序是从右到左

  1. 使用index遍历字符串
for(var index in str)
    {
        console.log(str[index]);
    }

使用如上代码可以遍历字符串并输出

  1. charAt根据索引返回字符以及把ASCII转换为字符
    依然使用上面定义的str字符串
console.log(str.charAt(0));

则输出结果为a
另外,使用charCodeAt还可以根据索引返回当前的ASCII码值
fromCharCode可以用来把ASCII值转化为字符

console.log(String.fromCharCode(97));

输出结果为小写字母a

  1. substr字符串的截取
    substr的两个参数分别为开始截取的位置和截取的长度,例如
console.log(str.substr(0, 2));

输出结果为a,

  1. replace字符替换
    使用replace可以对字符串中的字符进行替换,返回值是替换之后的字符串,例如:
console.log(str.replace("a", "m"));

输出的值为将字符串中的a替换为m后的字符串,即m,b,c,def,g
注意:这个方法并不能改变原本的字符串

  1. search按字符返回当前索引
console.log(str.search('a'));

输出结果为0

  1. split将字符串转换为数组
console.log(str.split(","));

其中的逗号意思是以逗号为分隔符将逗号两边的转化为数组

  1. length长度属性
    功能是输出字符串的长度,例如
console.log(str.length);

输出结果为12

  1. 大小写转化
    大小写转化主要用两个方法toUpperCase()和toLowerCase()
    用法如下:
console.log(str.toUpperCase());
console.log(str.toLowerCase());

二、字符串的常见算法

  1. 找一个字符串中最长的单词
var st = "The quick brown fox jumped backed jumped over the lazy dog";
    function showDanci(str) {
        var arr = st.split(" ");
        var temp = arr[0];
        for (var i = 1; i < arr.length; i++) {
            if (temp.length < arr[i].length) {
                temp = arr[i];
            }
        }
        return temp;
    }
    console.log(showDanci(st));

输出结果为jumped,即6位字母的最长单词

  1. 数组去重
var arr = [1, 1, 2, 3, 4, 3, 5, 5, 6, 7, 8, 8, 9, 9, 9, 9, 9, 9, 9, 9, 9];
    function moveNumber(array) {
        for (var i = 0; i < array.length - 1; i++) {
            var temp = array[i];
            for (var k = i + 1; k < array.length; k++) {
                if (temp == array[k]) {
                    array.splice(k, 1);
                    k--;
                }
            }
        }
        return array;
    }
    console.log(moveNumber(arr));

输出结果为去重后的数组,即[1, 2, 3, 4, 5, 6, 7, 8, 9]

  1. 统计一个字符串中出现最多的以及出现的字数(给出一个字符串,统计出现次数最多的字母)
var str1 = "cccccccccasdfssaaasasasasaadddddddd";
    function findChar(str) {
        var ss = moveNumber(str.split(""));
        /*[a,c,f,h]*/
        var list = [];
        for (var i = 0; i < ss.length; i++) {
            var count = 0;
            for (var index in str) {
                if (ss[i] == str.charAt(index)) {
                    count++;
                }
            }
            list.push([ss[i], count]);
        }
        var tong = 1;
        for (var i = 0; i < list.length; i++) {
            if (list.length <= tong)break;
            if (list[i][1] > list[i + 1][1]) {
                list.splice(i + 1, 1);
                i--;
            }
            else if (list[i][1] < list[i + 1][1]) {
                list.splice(i, 1);
                i--;
            }
            else {
                tong++;
            }
        }
        return function () {
            var strlist = "";
            for (var i = 0; i < list.length; i++) {
                strlist += list[i][0] + "---" + list[i][1] + "个"
            }
            return strlist;
        }

    }
    console.log(findChar(str1)());

输出结果为c—9个a—9个d—9个

  1. 阶乘
function jiecheng(n) {
        if (n <= 1) {
            return 1;
        }
        return n * jiecheng(n - 1);
    }
    console.log(jiecheng(5));

输出结果120

三、JavaScript数组以及常用方法

  1. 数组的基本声明

定义一个数组并输出

var arr=new Array({});
    console.log(arr);

输出结果为一个空的数组,即:
0: {}
length: 1
__ proto__: Array(0)

  1. 数组的赋值

还是使用上面那个数组,我们可以对其直接进行赋值

arr[0]=1;
    arr[1]="a";
    arr[2]=null;
    arr[3]={};
    arr[4]=true;
    arr[5]=undefined;
    arr[6]=function(){};
    console.log(arr[0]);

赋值后输出,结果就是一个赋值后的数组
0: 1
1: “a”
2: null
3: {}
4: true
5: undefined
6: ƒ ()
length: 7
__ proto__: Array(0)

  1. 数组的简化声明
var  a=[1,2,3,4];
var b=[4,5,6];

这样的方法也可以直接声明一个有值的数组

  1. 数组的过滤

使用filter方法可以对数组中的值进行过滤并返回过滤出的值,例如,过滤上面定义的a数组中2的倍数

console.log(a.filter(function (val, index, arr) {
        if (val % 2 == 0) {
            return val;
        }
    }));

返回结果是一个含有2和4的数组

  1. 将数组转化为字符串

利用join方法可以将数组转化为字符串

console.log(a.join(""));

输出结果为字符串1234

  1. 遍历数组,映射一个新数组

例如,可以声明一个b数组,使其里面的值为a数组每个值的平方,写法如下

var b=a.map(function (val, index, arr) {
            return val*val;
    })
    console.log(b,a);

输出为b数组和a数组
b数组:[1, 4, 9, 16]
a数组:[1, 2, 3, 4]

  1. 数组的截取

使用slice方法可以对数组进行截取,对原数组是无影响的,例如,截取数组a的1号到3号位置输出后,再输出原数组a

console.log(a.slice(1, 3));
    console.log(a);

输出结果为[2, 3]
[1, 2, 3, 4]

  1. 数组的截断

splice方法是对数组进行截断,与使用slice截取不同的是,splice可以影响到原数组,截取之后,原数组会删除掉截取的这些值,例如对数组a的0号到3号进行截断后,再输出原数组

console.log(a.splice(0, 3));
    console.log(a);

输出结果为[1, 2, 3]
[4]

  1. 数组的往前追加和往后追加

往前追加是unshift,往后追加是push
先在数组后追加一个9,输出后再往前追加一个7,再输出

a.push(9)
    console.log(a);
    a.unshift(7)
    console.log(a);

两次输出结果为[4, 9]
[7, 4, 9]

  1. 数组的前删和后删

前删是shift,后删是pop
使用上面[7, 4, 9]那个数字,先前删输出,再后删输出

a.shift()
    console.log(a)
    a.pop();
    console.log(a);

两次输出结果为[4, 9]
[4]

  1. 数组的翻转

使用reverse方法可以使数组翻转,例如

var  a=[1,2,3,4];
a.reverse();
    console.log(a);

输出结果为[4, 3, 2, 1]

  1. 数组的简单排序

sort方法的用途是对数组进行排序,默认是从小到大排序

var b=[2,1,4,3,6,5];
    console.log(b.sort());

输出结果[1, 2, 3, 4, 5, 6]

  1. 检测数组里面的值

some方法,用于检测数组里面的值,返回值是true和false,代表检测到或未检测到

console.log(b.some(function (val, index, arr) {
        return val == 11;
    }));
    console.log(b.some(function (val, index, arr) {
        return val == 1;
    }));

输出结果分别为false和true

  1. 累加器
console.log(b.reduce(function (totle, current, index) {
        console.log(totle,current);
        return totle *= current;
    }));

输出结果为1 2
2 3
6 4
24 5
120 6
720
前面一列代表总数,后面的则为当前要加上去的数

四、JavaScript中数组的排序

  1. 冒泡排序
var arr = [3, 2, 0, 1, 7, 5, 4, 6, 9, 8];
    function maopao(array) {
        if (array.length == 1) {
            return array;
        }
        var temp;
        for (var i = 0; i < array.length - 1; i++) {
            for (var k = 0; k < array.length - i - 1; k++) {
                if (array[k] < array[k + 1]) {
                    temp = array[k];
                    array[k] = array[k + 1];
                    array[k + 1] = temp;
                }
            }
        }
        return array;
    }
    console.time();
    console.log(maopao(arr));
    console.timeEnd();
  1. 快速排序
function quickSort(array) {
        if (array.length <= 1) {
            return array;
        }
        var center = array.splice(parseInt(array.length / 2), 1);
        var left = []; //相对于中间值  左边放  右边放
        var right = [];
        for (var i = 0; i < array.length; i++) {
            if (array[i] < center) {
                left.push(array[i]);
            }
            else {
                right.push(array[i]);
            }
        }
        return quickSort(left).concat(center).concat(quickSort(right));
    }
    console.time();
    console.log(quickSort(arr));
    console.timeEnd();
  1. 选择排序
function selectSort(array){
        if(array.length<=1)
        {
            return array;
        }
        //默认一个值  数组里面第一个
        for(var i=0;i<array.length;i++)
        {
            var temp;
            for(var k=i+1;k<array.length;k++)
            {
                if(array[k]>array[i])
                {
                    temp=array[i];
                    array[i]=array[k];
                    array[k]=temp;
                }
            }

        }
        return array;
    }
    console.time();
    console.log(selectSort(arr));
    console.timeEnd();
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值