前端JS基础知识复习笔记(1)
珠峰前端JS基础复习笔记(1)
在财务工作中自学了HTML和CSS之后,硬啃了JS高级编程三,实在觉得想要学的透是需要找一位好老师的,于是最近在学习周啸天老师的JS高级编程课,课外需要再补补基础,就回过头看看基础,这里我会不定期更新博客,主要还是自己复习的时候方便,感兴趣的筒子们我们可以一起学习呀····这里的笔记也是周老师允许上传复制的哦,没有侵犯人家的版权哦。希望每一个努力的人儿都有所回报,将来的你一定会感激现在的你的!加油~~
浏览器分类
1.以谷歌浏览器webkit内核为主(V8引擎)
- 谷歌浏览器 Chrome
- 苹果浏览器 Safari
- 国产浏览器
- 360普通浏览器
- 360极速浏览器
- 猎豹浏览器
- 搜狗浏览器
- QQ浏览器
- UC浏览器
- …
欧朋浏览器 Opera (v14版本时候)
2.Gecko内核
- 火狐浏览器 Firefox
3.Trident内核
- IE浏览器
- IE6~8
- IE9~IE11
- IE Edge
开发者工具
打开开发者工具:F12 / FN+F12 (再或者浏览器页面 -> 右键 ->检查)
- Elements 包含了当前页面中所有的结构和样式,基于它可以快速查看和调整页面的样式和结构等
- Console 控制台,在JS中,我们可以向控制台输出一些内容,来进行项目的调试;如果项目程序出现问题,也可以在控制台查看报错信息;也可以在控制台编写代码,做一些测试…
- Network 包含了当前页面所有向服务器发送的HTTP请求信息,一般用于前后端数据交互中的BUG调试以及页面中的性能优化
- Sources 包含了当前项目的原代码
- Application 可以看到本地存储的信息(Cookie/LocalStorage/SessionStorage…)以及当前网站中所有加载的图片等信息(抓取一些图片下来)
- …
- 开启手机模拟器 Toggle Device Toolbar
职业习惯:打开浏览器页面,第一步就是F12打开控制台
===================================
Web页面由:
- HTML 搭建页面结构
- CSS 编写页面样式
- JS 完成人机交互效果
- 基本的人机交互效果
- 页面中具体效果的实现
- 页面中动态数据的获取和绑定
- 可能会操作浏览器的一些功能
- …
=> JS是用来操作DOM和操作浏览器的
JS组成的三部分
- ECMAScript(ES3 / ES6~9) 定义了JS的语法规范:定义了语言本身的变量、数据值、操作语句、内存管理…等内容
- DOM(document object model)文档对象模型:提供对应的属性和方法,可以让JS操作页面中的DOM元素
- BOM(browser object model)浏览器对象模型:提供操作浏览器的属性和方法
注意:当代项目开发,一般都是基于Vue/React完成的,基于这两个框架,我们已经不去操作DOM了,我们操作数据,由框架本身帮助我们完成DOM的操作
JS中的变量 variable [ˈveəriəbl]
变量:可变的量(其存储的值是可变的),设置一个变量(起个名字),让其代表和指向某一个具体的值
1.JS中创建变量的几种方式
- ES3:var
- ES6:let 、const
- function 创建函数
- class 创建一个类
- import / require 基于ES6Module或者Common.js规范导入模块
// 1.基于VAR创建
var n = 10;
var m;
console.log(n, m); //=>10 undefined// 2.基于ES6中的LET创建
let a = 100;
a = 200;
console.log(a); //=>200// 3.基于ES6中的CONST创建(基于CONST定义的变量一般也被成为常量);
const b = 1000;
b = 2000;
console.log(b); //=>Uncaught TypeError: Assignment to constant variable.// 4.创建一个函数
function func() {}
console.log(func);// 5.创建一个类
class Parent {}
console.log(Parent);// 6.基于模块规范来导入具体的某个模块
import axios from './axios';
let axios = require('./axios');
2.变量命名的规范
- 严格遵循大小写
//=>编写代码的时候一定要区分大小写问题
let Test = 100;
console.log(test); //=>Uncaught ReferenceError: test is not defined
- 使用驼峰命名法
由有意义英文组成一个名字,第一个单词首字母小写,其余每一个有意义的单词首字母大写
let studentInfomation = {name: '珠峰培训'
};
let studentInfo = {};//=>项目中常见的有特殊含义的端词组
add / insert / create 新增/插入/创建
del / delete / remove 删除/移除
update 修改
select / query / get 查询/获取
info 信息
...
- 命名规则:使用 “$、_、英文字母、数字” 命名
数字不能作为开头
// 基于$开头:一般代表使用JQ或者其它使用$的类库获取的内容
let $box;
// 基于_开头:一般代表是全局或者公共的变量
let _box = {};
// 基于数字区分相似名称的变量
let box1 = 10;
let box2 = 20;
// 数字不能作为开头
// let 2box = 10;
// 想要分隔单词,可以使用_或者驼峰,但是不能是-
// let box-list;
let box_list;
let boxList;
// 虽然不会报错,但是强烈不推荐
let 盒子 = 100;
console.log(盒子);
- 不能使用关键字和保留字
关键字:在JS中有特殊含义的
保留字:未来可能会成为关键字的
// var var = 10;
JS中的数据类型
- 基本数据类型(值类型 / 原始值)
- 数字 number
- 字符串 string
- 布尔 boolean
- 空对象指针 null
- 未定义 undefined
- ES6新增的唯一值类型 symbol
- 引用数据类型
- 对象数据类型 object
- 普通对象 {}
- 数组对象 []
- 正则对象 /^$/
- 日期对象 new Date
- 数学函数对象 Math
- …
- 函数数据类型 function
- 对象数据类型 object
前端JS基础知识复习笔记(1)相关推荐
- 前端JS基础知识复习笔记(2)
珠峰的JS基础课程笔记(第二天) 今天早上做完了变量的作业,下午听基础课做做笔记,最好没有事干的时候可以翻出来看看,欢迎大家收藏和我一起复习回顾记忆,一起学习一起成长一起挣钱钱ヾ(◍°∇°◍)ノ゙ . ...
- 前端学习——JS基础知识点复习
一. JS复习 1.1 如何使用JS HTML标签内使用JS,要求写在onclick等事件属性或者href属性中(不推荐使用) 页面中的script标签内可以直接写JS代码 script标签的src属 ...
- linux基础知识复习
@(tigerfive)[linux,基础知识,复习笔记] linux基础复习(一) 今天只整理框架,具体内容之后详细整理吧 文件管理 文件基本操作 创建文件和目录 拷贝文件和目录 剪切文件和目录 删 ...
- 前端学习笔记(js基础知识)
前端学习笔记(js基础知识) JavaScript 输出 JavaScript 数据类型 常见的HTML事件 DOM 冒泡与捕获 流程控制语句 for..in 计时器 let,var,const的区别 ...
- 基础知识复习,html、css、js
基础知识复习 HTML 一些标签的复习 一些符号的复习 CSS JS 许久没有写代码了,今年的上半年大部分时间在与模拟电路.数字电路.单片机这些东西打交道,本以此发展为主业,后发现十分痛苦.前两天写了 ...
- JS基础知识学习(一)
JS基础知识 前端开发常用的浏览器 谷歌浏览器(chrome):Webkit内核(v8引擎) 火狐浏览器(firefox):Gecko内核 欧朋浏览器(opera):Presto内核 IE浏览器:Tr ...
- 2021 版 Spring Boot 基础知识复习手册(2w字,建议收藏)
点击上方 好好学java ,选择 星标 公众号重磅资讯,干货,第一时间送达 今日推荐:分享一套基于SpringBoot和Vue的企业级中后台开源项目,这个项目有点哇塞!个人原创100W +访问量博客: ...
- (七)JS基础知识四(搞定异步)【三座大山之三,必考!!!】
JS基础知识四(异步) 提问 单线程 应用场景 callback hell和promise 提问 同步和异步的区别是什么 手写用Promise加载一张图片 前端使用的异步的场景有哪些 单线程 JS是单 ...
- 了解js基础知识中的作用域和闭包以及闭包的一些应用场景,浅析函数柯里化
js基础知识中的作用域和闭包 一.作用域 1.作用域.自由变量简介 (1)作用域定义 (2)作用域实例演示 (3)自由变量定义 (4)自由变量实例演示 2.作用域链简介 (1)作用域链定义 (2)作用 ...
最新文章
- 剑指offer_第2题_替换空格
- 开机自启动脚本_Linux配置开机自启动执行脚本的两种方法
- Shell中的循环语句
- SQL语句 怎么把从一个表中查出来数据插入到另一个表中
- Python | Socket01 - 创建一个TCP服务器(阻塞+单线程),将TCP客户端发过来的字符串原路返回
- OpenShift 4 - 为Gogs构建一个Operator
- UVA485 Pascal‘s Triangle of Death【大数】
- Sourcegraph 代码搜索
- DIP 电源跌落瞬时中断(Voltage dips)
- win10家庭版和专业版的区别
- 盘点购物分享系统,有兴趣的来看看哦
- 并联机器人自由度计算
- 将m个相同的球全部放到n个相同的盒子里面有几种放法
- DDoS deflate:自动屏蔽DDOS攻击IP
- 360 ie8兼容模式 网页兼容问题
- 最好用的插件管理器:扩展管理器(支持:Chrome、Edge、Firefox)
- 我的减肥经历和一些经验[1]
- IIS 7.5 HTTP 错误 404.3 - Not Found错误的解决方法
- 一文读懂Android View事件分发机制
- 椭球面投影面积计算(使用GeographicLib库)