前端总体大纲

最新推荐文章于 2024-07-31 14:35:30 发布

哆啦A梦的百宝箱口袋

最新推荐文章于 2024-07-31 14:35:30 发布

阅读量312

点赞数

文章标签：前端 javascript vue.js 面试经验分享

本文链接：https://blog.csdn.net/m0_67658927/article/details/125509822

版权

第一章：js 基础

希望大家勤奋举手，比如问大家会不会的时候，人的一生那么短暂，你不妨大胆点，攀一次山，跨一条河，举一次手

什么是js？

1、是一种解释性脚本语言（代码不进行预编译）。
2、主要用来向HTML（标准通用标记语言下的一个应用）页面添加交互行为。
3、可以直接嵌入HTML页面，但写成单独的js文件有利于结构和行为的分离。
4、跨平台特性，在绝大多数浏览器的支持下，可以在多种平台下运行（如Windows、Linux、Mac、Android、iOS等）。
Javascript脚本语言同其他语言一样，有它自身的基本数据类型，表达式和算术运算符及程序的基本程序框架。Javascript提供了四种基本的数据类型和两种特殊数据类型用来处理数据和文字。而变量提供存放信息的地方，表达式则可以完成较复杂的信息处理。

js可以做什么？

1、使网页具有交互性，例如响应用户点击，给用户提供更好的体验
2、可以处理表单，检验用户的输入，并提供及时反馈节省用户时间。例如，表单中要你输入电子邮箱而你却输入一个手机号，那么应该给你一个提醒。
3、还可以根据用户的操作，动态的创建页面。例如，发邮件时，添加附件操作。
4、设置cookie，cookie是存储在浏览器上的一些临时信息，例如你浏览过的网站地址，使用过的用户名

js 变量（4星）

var let const
定义变量规则等
单行注释和多行注释

js数据类型：（4.5星）

值类型(基本类型)：字符串（String）、数字(Number)、布尔(Boolean)、对空（Null）、未定义（Undefined）、Symbol。
引用数据类型：对象(Object)、数组(Array)、函数(Function)。

注释：ES6 引入了一种新的原始数据类型 Symbol ，表示独一无二的值，最大的用法是用来定义对象的唯一属性名
let sy = Symbol("KK");
console.log(sy);   // Symbol(KK)
typeof(sy);        // "symbol"

检测数据类型：typeof  typeof()

表达式和运算符

1 算术运算符：+  -   *   /    %
2 比较运算符：>    <   >=   <=   ==  ===   !=  !==
3 赋值运算符：=   +=   -=   *=    /=    %=
4 逻辑运算符：&&    ||   ! 
5 字符串运算符 +
6 逗号运算符 var a = 1,b = 2,c = 3,d = 4;
7 小括号运算符a=(1+2)*4; 改变优先级
8 条件运算符 也叫三目运算，三元运算 ？：
9 typeof运算符和instanceof运算符：https://www.cnblogs.com/SourceKing/p/5766210.html

流程控制语句

if判断

switch

switch (num) {
    case 0:
        day = "星期天";
        break;
    case 1:
        day = "星期一";
         break;
    case 2:
        day = "星期二";
         break;
    case 3:
        day = "星期三";
         break;
    case 4:
        day = "星期四";
         break;
    case 5:
        day = "星期五";
         break;
    case 6:
        day = "星期六";
}

for循环

简单的for循环梳理
 	continue
 	break
while循环语句的概念及使用
    while (i<5)
    {
        x=x + "The number is " + i + "<br>";
        i++;
    }
for...in...循环语句的概念及使用
    var obj = {a:1, b:2, c:3};

    for (var prop in obj) {
      console.log("obj." + prop + " = " + obj[prop]);
    }

练习：

1，自定义方法，实现1~100偶数求和（多种方法实现）

2，使用for和while循环在页面上输出九九乘法口诀表

3，实现字符串的反转（多种方法） str="addkfkfk"

4、在浏览器中输出金字塔

代码示例：（三角金字塔）

var i,num,k;
num = prompt("请输入金字塔的行数");
for(i=1;i<=num;i++){
    for(k=1;k<=num-i;k++){
        document.write("&nbsp;");
    }
    for(j=0;j<2*i-1;j++){
        document.write("*");
    }
    document.write("<br>");
}

数组(5星)

数组的创建
数组的长度属性
多维数组  var a = [[1,2,3],[2,3,4]]；
数组的遍历
数组的方法
1.pop（） 删除并返回数组的最后一个元素
2.push()    表示向数组的末尾添加一个或多个元素
3.shift()    表示删除并返回数组的第一个元素
4.splice()   删除一个元素并且向删除的元素位置添加一个新元素
5.unshift()  表明向数组的开头添加一个元素或多个元素并且返回新的长度
6.sort()    表明对数组的元素进行排序，一般是升序排列
7.reverse()   表示颠倒数组中元素的顺序
8.toString()    表示把数组转化为字符串并返回结果
9.slice()    表示从某个已有的数组返回选定的元素
10.join()     把数组的所有元素放入一个字符串
11.indexOf(el)   从头（序号0）开始查找元素 
12.lastIndexOf(el)   从尾部（序号1）开始查找元素

函数

函数如何定义
函数的调用执行
函数参数
函数无返回值
return的作用

作业：

1、封装任意若干个实参的求平均数

2、封装字符串中某个字符出现的个数一个是几个，的函数。str="aaabdddccc"

3、封装数组中的位置方法indexOf的功能函数(获取文件的后缀名)

4、封装数组的排序方法（根据学习成绩，语文排序，数学排序，英语排序，数据自定义）

5、封装数组的去重方法（五星）（arr=[11,2,3,2,11]）

6、封装数组的求最大值最小值函数

字符串（4.5星）

`toUpperCase` :把小写字母转成大写 
`toLowerCase` 把大写转小写 
`charAt` :通过索引获取字符 
`charCodeAt` :通过索引获取对应字符的Unicode编码； 
`substr` :截取 substr(m,n) 从索引m开始，截取n个字符； 
`substring`: substring(m,n)：从索引m开始，截取到索引n，不包含n; (不支持负数) 
`slice(m,n)`:substring; 从索引m开始，截取到索引n，不包含n (支持负数) 
`indexOf` :检测字符在字符串中第一次出现的索引位置； 
`lastIndexOf` :检测字符在字符串中最后一次出现的索引位置； 
`split`: 把字符串按照特定的字符分隔数组中的每一项； （1~23）
`replace`:替换;原有字符串不变；用新字符替换旧的字符 
`concat` :拼接 
`trim` :去空格 : 去除字符串中左右的空格；

作业：

1、查找某个字符串中出现次数最多的字符以及显示出现的最大次数

2、替换指定字符串中的某个所有字符(str="共产党替换成")

3、自定义方法返回文件后缀名

4、封装方法，实现字符串的反转 “qwera”-》“arewq”（要求，实现4种以上方法）

数学对象Math（3星）

Math对象的属性

属性	描述
E	返回算术常量 e，即自然对数的底数（约等于2.718）。
LN2	返回 2 的自然对数（约等于0.693）。
LN10	返回 10 的自然对数（约等于2.302）。
LOG2E	返回以 2 为底的 e 的对数（约等于 1.414）。
LOG10E	返回以 10 为底的 e 的对数（约等于0.434）。
PI	返回圆周率（约等于3.14159）。
SQRT1_2	返回返回 2 的平方根的倒数（约等于 0.707）。
SQRT2	返回 2 的平方根（约等于 1.414）。