web开发

参考文档

一.前端开发的概念介绍及前端开发的核心

前端的概念：用户可以直接看见并交互的界面,即浏览器上运行的用户交互界面 (浏览器端，客户端)。

前端的基础技术栈：

HTML

CSS

JavaScript介绍

1. JavaScript 诞生于 1995 年。布兰登·艾奇（Brendan Eich）开发。
2. JavaScript是一种轻量级、解释型的Web开发脚本语言
3. 浏览器脚本语言，可以编写运行在浏览器上的程序
4. 负责编写页面特效、调用浏览器的API(BOM)、操作改变页面内容(DOM)，从后端获取数据(Ajax)，渲染页面等
5. 文件后缀：.js

前端核心工作组成部分：

1. 数据渲染（根据数据设计html结构，渲染页面，展示页面…….）
2. 用户体验（网页效果，表单验证，其他功能……）
3. 性能优化（精灵图，懒加载 ，代码的压缩合并，图片的压缩合并，css的预编译…….）

二.javascript的核心组成及如何运行Js

1.javascript的核心组成

核心（ECMAScript）：描述了该语言的语法和基本对象。

文档对象模型（DOM）：描述处理网页内容的方法和接口

浏览器对象模型（BOM）：描述与浏览器进行交互的方法和接口。

2.如何引入js文件

引入外部js

<script src=".js文件存放路径"></script>这个方法是在外部单独建立一个js文件，页面中所有的js都在这一个页面中。易于维护，方便多次使用。

当前页面中

直接把js效果写在<script></script>标签中即可。这部分内容可以放在页面中的任何位置。但是一般放在页面的底部。这样的话便于页面加载完成再执行js文件。

三. 变量的概念 - 重点

1.概念：

所谓变量，就是特定时间用于保存特定值的一个名字而已，并且初始化后可以再次改变的量。

2.声明定义：

使用 var 操作符（var是关键字），后面跟一个变量名（变量名是标识符）,声明多个变量的时候，可以在一行或者多行操作，只要把每个变量用逗号分隔开即可，但最好分行写，可读性佳。

3.变量的特点

初始化后可以再次改变

变量是松散类型的，可以用来保存任何类型的数据。

变量提升

同时声明多个

写入内存

4.命名规则：

数字、字母、下划线、$符号组成，其中数字不能做开头。并且变量名应做到见名知意，常用的方式有驼峰命名法，匈牙利命名法，同时变量名不能是保留字或者关键字 。

驼峰命名：第二个单词开始，首字母大写。

大驼峰：第一个单词的首字母大写 UserName

小驼峰：第二个单词开始首字母大写 userName / getElementById()

5.保留字和关键字

关键字：一组具有特定用途的关键字，这些关键字可用于表示控制语句的开始或结束，或者用于执行特定操作等。

break do instanceof typeof case else new var catch finally return void  continue for switch while debugger function this with default if throw delete in try

保留字：尽管保留字在这门语言中还没有任何特定的用途，但它们有可能在将来被用作关键字。

abstract enum int short boolean export interface static byte extends long super char final native synchronized
class float package throws const goto private transient debugger implements protected volatile double import public

四.变量的数据类型

ECMAScript5 之前有 5 种简单数据类型：number数字 、 string字符串、boolean布尔值、undefined未定义、null空对象。

还有一种复杂数据类型（引用类型）——object

检测变量类型的方法：typeof( 变量名 ) 或者 typeof 变量名

变量的数据类型（Undefined、Null：特殊类型）

注意：typeof可以输出变量的数据类型，但这个数据类型的类型都是字符串。

五.赋值、数学、关系运算符

1.赋值运算符 = 将等式右边的结果赋值给左边。

javascript使用“ = ”运算符来给变量或者属性赋值（最低优先级）

复合赋值操作 +=、-=、*=、/=、%= 带操作的复合赋值运算,（更快捷，更优）。

2.数学运算符 + - * / %

+：求和，连接字符作用（字符串和变量之间使用+号进行拼接）

%：求余数（求模）

3.关系运算符（结果为布尔值） <、>、<=、>=、==( 相等 )、===（全等）、!=(不相等) !==（不全等）

理解=、==、===运算符之间的区别。

理解相等和恒等运算符

六.逻辑运算符

逻辑与(&&)操作可以应用于任何类型的操作数，而不仅仅是布尔值。在有一个操作数不是布尔值的情况下，

逻辑与操作就不一定返回布尔值。逻辑与操作属于短路操作，即如果第一个操作数能够决定结果，那么就不

会再对第二个操作数求值。

逻辑或(||)和逻辑与操作相似，如果有一个操作数不是布尔值，逻辑或也不一定返回布尔值，逻辑或操作符也

是短路操作符。也就是说，如果第一个操作数的求值结果为true ，就不会对第二个操作数求值了。

逻辑非操作符由一个叹号（！）表示，可以应用于 ECMAScript 中的任何值。无论这个值是什么数据类型，

这个操作符都会返回一个布尔值。逻辑非操作符首先会将它的操作数转换为一个布尔值，然后再对其求反。

总结

逻辑与找的假的立刻结束，形成短路，

逻辑或找到真的立刻结束，形成短路。

七.一元运算符

一元运算符：++ –

只能操作一个值的操作符叫做一元操作符，是 ECMAScript 中最简单的操作符。

前置型应该位于要操作的变量之前，先将操作数+1或者减1，再参与运算。

后置型则应该位于要操作的变量之后，先参与运算后自身再+1或者减1。

八.变量不同类型之间的转换

1.显式转换：利用系统提供的函数(具有特定功能的代码块组成)强制转换或者手动转换

强制转换方法：Number( ) 、String( )、Boolean( )

字符串转数字：parseInt( )、parseFloat( )

2.隐式转换：系统自动根据当前的符号进行转换

+ - * / % == ++ – ! ……

九.NaN和isNaN介绍

NaN的概念及应用

当数学计算无法得到数字结果，该变量的值为NaN(not a number)

注意：因为NaN代表非数字，它不等于任何值，也不能做运算，

即使alert(NaN == NaN); 结果也是false typeof NaN ===‘number’

isNaN(num)方法，该方法判断num变量的值是否是NaN（不是一个数字）,结果是布尔值,如果num不是一个数字输出true

十.csdn搜的题

1.为抵抗洪水，战士连续作战89小时，编程计算共多少天零多少小时？

2.var k=0; console.log(k++ + ++k +k +k++ );

3.输入一个五位数，分别输出个十百千万位；

4.基本测试题，并写出详细理由;

var bar = true;

console.log(bar + 0);

console.log(bar + "xyz");

console.log(bar + true);

console.log(bar + false);

console.log(1 == true);

console.log(1 === true);

console.log(isNaN(23));

console.log(isNaN('shuai'));

console.log(isNaN('321shuai'));

console.log(isNaN('321'));

console.log(NaN === NaN);

console.log(typeof NaN);

console.log(1 + +"2" + "2");

console.log("A" - "B" + "2");

console.log("A" - "B" + 2);

console.log(0 || 2 || 1)

console.log(0 && 0 && false);

console.log(0.2 + 0.4 == 0.6);

console.log(Boolean('0'));

5.基本测试题，并写出理由;

var a = 10;

var b = 20;

var c = 10;

console.log(a = b);

console.log(a == b);

console.log(a == c);

十一.学习网站

CSDN：https://www.csdn.net/

力扣： https://leetcode-cn.com/problemset/all/

牛客网：https://www.nowcoder.com/

---