前端基础知识点(3)

冷不防 2021-07-25 19:03 411阅读 0赞

# 前端知识点——雪碧图的使用 #

雪碧图的使用方法：  
是将图片与颜色属性结合在一起的用法：  
background:颜色 Url(图片路径) 位置x 位置y 是否重复。  
例如：  
`background:#f40 url(../images/ico.png) 0 -500px no-repeat;`

# 前端知识点——table表格的使用 #

table表格的初始化代码

table{
    	border-collapse:collapse;
    }
    th,td{
    	padding:0;
    }

table表格的列宽有两种形式，一种是由内容自动撑开，一种是自动均分。  
`table-layout:fixed;`设置后可以实现表格列宽均分。

# 前端知识点——word-break #

`word-break:keep-all;`可以保证让文字以空格进行换行展示

# 前端知识点——javascript的特点 #

javascript是解释性语言，通常是通篇阅读文档，检查是否有低级的语法错误，然后解释一行执行一行。  
特点有两个：

1.  单线程
2.  解释性语言

# 前端知识点——html和css的加载机制 #

通过link标签嵌入的css样式，css和html是如何加载的？  
link标签是异步加载的过程，也就是再开启一个线程，所以Html和css同时加载。

# 前端知识点——ES DOM BOM #

ES是ECMAScript的缩写，是javascript的原生部分。  
DOM:操作的是html+css;  
BOM:从左的是浏览器  
**DOM+BOM+ECMAScript**是JS的三大部分。

# 前端知识点——主流浏览器及其内核 #

IE浏览器，内核是 trident  
Chrome浏览器，内核是webkit,后期内核是blink;  
firefox浏览器，内核是Gecko;  
Opera浏览器，内核时presto;  
Safari浏览器，内核是webkit;

# 前端知识点——js的引入 #

1.  页面内嵌入  
    为了符合web标准(w3c标准中的一项)结构/样式/行为相分离，通常会采用外部引入的形式。

# 前端知识点——js的基本语法变量部分 #

变量的声明和赋值是分开的。变量的声明是通过单一的var来进行声明的。  
变量的命名规则：

1.  变量名必须以英文字母 \_ $开头。
2.  变量名可以包含英文字母 \_ $ 数字
3.  不可以用系统的关键字 保留字作为变量名

# 前端知识点——js的基本语法值类型部分 #

值类型又称为数据类型，分为两种：

1.  不可改变的原始值（栈数据）
2.  引用值（堆数据）  
    原始值分为：Number String Boolean undefined null 共五种  
    引用值分为：array object function  
    一个变量声明了但是没有赋值，调用的时候就会提示 undefined;

## 原始值 ##

原始值是存放到栈里面的，栈的特点是先入后出.  
`var a = 1;var b = a;`  
b=a,代表的是b指向的是a复制出来的内容，copy此时对a进行操作，是不影响b的结果的。

## 引用值 ##

引用值内容基本是存放到堆中，堆中存放的是内容，栈当中存放大的是堆的地址。  
所以如果：`var arr = [1,2];var arr1 = arr;`此时arr1和arr在栈中存放的是都是同一个堆的地址，所以此时堆arr操作，arr1的值也会发生改变。

var arr=[1,2];
    var arr1=arr;                    // arr和arr1指向的是同一个地址
    arr.push(3);
    document.write(arr1);      //此时的arr 和arr1结果是相同的
    document.write(arr);

var arr=[1,2];
    var arr1=arr;					//arr和arr1指向的是同一个地址
    arr=[1,3];							//arr又指向了另一个空间
    document.write(arr1);		//此时的arr和arr1结果是不同的了
    document.write(arr);

# 前端知识点——js基本语法语句基本规则 #

1.  语句后面要用分号结束；
2.  js语法错误会引发后续代码的终止但不会影相其他js代码块。
3.  书写格式要规范，“= + / -”运算符两边都应该有空格。
4.  函数 for循环 if函数后面都是可以不加分号结束的。

# 前端知识点——js基本语法错误类型 #

1.  低级错误（语法解析错误）
2.  逻辑错误（标准错误，情有可原）

一个html文件中可以有多个script代码块，因为js是自上而下执行的，所以下面的script可以执行上一个script中的变量。

# 前端知识点——js运算符 #

1.  “+”加号  
    数学运算|字符串连接  
    任何数据类型加字符串都等于字符串；这个一定要注意，不要认为字符串可以进行隐式类型转换。
2.  “-” “\*” “/” “%” “=” “()”
3.  优先级"="最弱，“()”优先级最高
4.  “++” “–” “+=” “-=” “/=” “\*=” “%=”  
    例如：

var a = "a" + 1 + 1;
    document.write(a);

打印的结果是a11,因为运算是自左至右的运算的。

几个容易算错的题目：  
`0 / 0 = NaN;`  
`1 / 0 = infinity;`  
`-1 / 0 = -infinity;`

var a = 10;
    docuemnt.write(a ++);     //后++;先执行语句，再++;所以结果是 10
    document.write(a);			//结果是11

var a = 10;      
    var b = ++a - 1 + a++;       //前++，先++；  11 - 1 + 11 = 21；
    document.write(b + " " + a);       //b = 21; a = 12;

# 前端知识点——比较运算符 #

被认定为false的值有：  
undefined null NaN ‘’ 0 false;  
注意：空串和空格字符串是不同的，空串是false;空格字符串是true;

undefined == undefined true;  
infinity == infinity true;  
NaN == NaN false; //非数不等于非数  
undefined == null ; true;

# 前端知识点——逻辑运算符 #

先看第一表达式转化成布尔值的结果，如果结果为真，则会看第二个表达式转换为布尔值的结果，然后如果只有两个表达式的话，则只返回第二个表达式的结果就可以了。