THIS的五种情况汇总:
1、在事件绑定中:给当前元素的某事件行为绑定方法,事件行为触发,此时方法中的this是当前操作元素本身
2、普通方法执行看“点”2-1、方法执行看前面有没有点,如果有,点前面是谁,this就是谁,如果没有,this就是window,或者严格模式下的undefined2-2、自执行的函数一般是window,严格模式下是undefined2-3、回调函数:一般来说是window,除非在执行回调函数「内部方法」做了特殊处理
3、构造函数执行「new 执行」 构造函数体中的this是当前类的实例
4、箭头函数中(含块级上下文)没有自己的this,所用的this是上级上下文「宿主环境」的this, 箭头函数好用但是不能滥用,不涉及this随便用
5、基于Function.prototype上的call、bind、apply强制改变this指向
1、全局下指的是window
console.log(this);
2、函数调用的情况
函数执行就看函数前有没有点,如果有,点前面是谁,this就是谁,如果没有,this就是window,或者严格模式下的undefined
//'use strict'
functionfn(){
console.log(this)
}
fn();//这里的this就是window,在严格模式下就是undefined
varobj={
name:"li",
fn:fn,
}
obj.fn();//这里的this就是obj
自执行的函数一般是window,严格模式下是undefined
//'use strict';
(function(){
console.log(this)//window
})()
回调函数:一般来说是window,除非在执行回调函数「内部方法」做了特殊处理
<div id="box">11111</div>
<script>
box.onclick=function(){
console.log(this)
}
</script>
</body>
=======================
setTimeout(function(){
console.log(this);
},1000);
THIS练习题
1、
var name="珠峰培训";
function fn(){
console.log(this.name)
}
var obj={
name:"你好世界",
fn:fn
}
obj.fn();
fn();
(function(){
this.fn();
})();
答案:你好世界 珠峰培训 珠峰培训
2、
var a = 10;
function foo () {
console.log(this.a)
}
foo();
答案:10
3、
var a = 10;
function foo () {
console.log('this1', this)
console.log(window.a)
console.log(this.a)
}
console.log(window.foo)
console.log('this2', this)
foo();
答案:函数 window window 10 10
4、
let a = 10
const b = 20
function foo () {
console.log(this.a)
console.log(this.b)
}
foo();
console.log(window.a)
答案:undefined undefined undefined
5、
var a = 1
function foo () {
var a = 2
console.log(this)
console.log(this.a)
}
foo()
答案:window 1
6、
var obj1 = {
a: 1
}
var obj2 = {
a: 2,
foo1: function () {
console.log(this.a)
},
foo2: function () {
setTimeout(function () {
console.log(this)
console.log(this.a)
}, 0)
}
}
var a = 3
obj2.foo1()
obj2.foo2()
答案:2 window 3
7、
let obj={
name:"li",
fn:(function(n){
// 这里的this
console.log(this);
return function(){
// 这里的this
console.log(this);
}
})(10),
}
obj.fn();
答案:window 对象obj
8、
function fn(){
// 这里的this
console.log(this);
}
box.onclick=function(){
console.log(this);
fn()
}
答案:box元素 window
9、
var num=10;
var obj={num:20};
obj.fn=(function(num){
this.num=num*3;
num++;
return function(n){
this.num+=n;
num++;
console.log(num);
}
})(obj.num);
var fn=obj.fn;
fn(5);
obj.fn(10);
console.log(num,obj.num)
答案:22 23 65 30
10、
var obj = {
name: 'obj',
foo1: () => {
console.log(this.name)
},
foo2: function () {
console.log(this.name)
return () => {
console.log(this.name)
}
}
}
var name = 'window'
obj.foo1()
obj.foo2()()
答案:window obj obj
11、
varname='window'
varobj1={
name:'obj1',
foo:function(){
console.log(this.name)
}
}
varobj2={
name:'obj2',
foo:()=>{
console.log(this.name)
}
}
obj1.foo()
obj2.foo()
答案:obj1 window
12、
varname='window'
varobj1={
name:'obj1',
foo:function(){
console.log(this.name)
returnfunction(){
console.log(this.name)
}
}
}
varobj2={
name:'obj2',
foo:function(){
console.log(this.name)
return()=>{
console.log(this.name)
}
}
}
varobj3={
name:'obj3',
foo:()=>{
console.log(this.name)
returnfunction(){
console.log(this.name)
}
}
}
varobj4={
name:'obj4',
foo:()=>{
console.log(this.name)
return()=>{
console.log(this.name)
}
}
}
obj1.foo()()
obj2.foo()()
obj3.foo()()
obj4.foo()()
答案:
obj1.foo()()// 'obj1' 'window'
obj2.foo()()// 'obj2' 'obj2'
obj3.foo()()// 'window' 'window'
obj4.foo()()// 'window' 'window'
DOS命令窗口
1、 打开dos命令窗口的几种方法:
1) window+ r 或者在搜索里面 输入cmd
2)在资源管理器的当前路径上直接输入cmd
3) 鼠标右键 git bash here
2、常用的dos命令
dos 是linxu 写的,用c开发的,我们先来说下linxu 常用的一些命令
打开对应的文件夹:cd 文件夹 (确定当前目录下有改文件夹) 比如:C:\Users\Administrator\Desktop\test>cd a.txt
回退到上一级: cd ../
查看当前目录下的文件夹:cd + tab
返回到根目录:cd + /
创建一个文件夹:mkdir + 文件名
创建一个文件: touch 文件名.txt ,然后按回车。
重命名一个文件或者文件夹: rename b f
删除一个文件夹:rd + 文件夹名 (只能删除空的文件夹)
删除一个文件夹:rd + /s + 文件夹名 (硬删除,即使里面有内容也能删除)
删除一个 文件: del + 文件夹名
清空命令行:cls
切换磁盘命令:D: /F:/C: 切换到相应的盘符
如果不想一个个敲路径,可以用:cd + 把文件拖过来 自动生成此路径(mac 本)
MAC DOS常用命令
调出终端
command+空格打开搜索栏,搜索term打开终端
常用操作
clear 清空屏幕内容
pwd 查看当前所在目录位置(路径)
ls 显示当前目录下的文件内容
ls+路径 显示路径位置目录下的内容
cd -回到上一个目录
cd ~回到用户目录
/根目录
./当前目录
../上一级目录
mkdir ABC 在当前位置下,创建一个ABC名字的文件夹
touch ABC.c 在当前位置下,创建一个ABC名字的c文件
cd User 进去User文件夹
rm ABC.c 当前位置下,删除ABC.c文件
rm -rf User/ 删除当前位置下User文件夹(里面文件都会删除)
进入文件后vi命令
命令模式(Esc键 进入)
:q 退出
:w 保存
:wq 保存并退出
:q! 不保存退出
git版本控制系统
1、git(版本控制系统);到底什么是git,git又是做什么的呢
+ 记录历史版本信息
+ 方便团队之间协作开发
2、国内常用的版本控制系统
+ git:分布式管理系统
+ svn:集中式版本管理系统
+ 分布式和集中式的各自特点
1)svn集中式版本控制系统
2)git 分布式版本控制系统
3、git的安装:
> git官网 https://git-scm.com/downloads
> 安装成功后在桌面右键会出来两个git选项(打开git bash here,然后执行git --version)
> GIT是linux创始人研发的工具,所以GIT中的操作大部分都是linux操作命令
4、git的工作原理(分为三个区)
+ 工作区:我们平时写代码的区域
+ 暂存区:用来临时存储代码
+ 历史区:生成历史版本
5、 git的使用
- 1、git的全局配置
+ git config --global --list:查看全局配置信息
+ git config --global user.name 'xxx'
+ git config --global user.email 'xxx@xxx'
6、创建本地仓库,完成版本控制
+ 1、创建本地仓库
+ git init(会默认生成一个.git文件夹,这里是存放你本地git仓库的信息的,不能删除)
+ shift + cmmand + . mac电脑显示隐藏目录
+ 2、在工作区编写代码完成后,提交到暂存区
+ git add 文件名(把指定文件提交到暂存区)
+ git add A(把工作区所有文件提交到暂存区)
+ git add . (把工作区所有修改的和新增的文件提交到暂存区,不包括删除的)
+ git status(查看当前文件提交状态)【红色代表在工作区;绿色代表在暂存区;没有文件,并显示clear之类的单词,说明文件已经提交到历史区或者没有任何更改】
clear:清屏
+ 3、把文件提交到历史区
+ git commit -m'描述' (把文件提交到历史区,并生成此次提交的历史版本)
+ git log(查看提交的历史版本信息,不包括回滚)
+ git reflog(查看所有的历史版本信息,包括回滚信息)
+ 4、回滚指定历史版本的代码
+ git reset --hard 七位历史版本号
7、远程仓库的使用
- 1、介绍远程仓库github
+ github是一个开源的代码分享平台;每一个github账户都可以把自己的代码分享到这个平台上,那他就是充当中央服务器的角色,把代码提交到这个平台上之后,你可以在任何一个有网络的地方去下载代码,还可以配置下载的权限
- 2、创建一个远程仓库(点击左上角绿色的按钮 New)
+ Repository name:新建仓库的名称
+ Description:新建仓库的描述
+ Public/Private:新建仓库是公开还是私密的
+ Initialize this repository with:为仓库增加初始化文件(暂时不选)
+ 绿色按钮 Create repository: 创建新的仓库
- 3、把本地仓库的代码提交到远程仓库
+ 1、本地仓库和远程仓库建立连接
+ git remote -v(查看本地和远程仓库的连接状态)
+ git remote add origin 远程仓库地址(和远程仓库的某个新项目建立连接,origin这个名可以改,但是大 家都统一叫这个)
+ 2、git pull origin master (拉取远程仓库的代码到本地)
+ 3、git push origin master (推送本地的代码到远程仓库)
【要输入用户名和密码 username password】
- 4、git clone 远程仓库地址 仓库的名字(如果不写默认原仓库名)
+ 其真正的开发中,大家都使用这个
+ 你们的项目老大把项目骨架搭建好之后你们每一个项目小组成员都去把远程的代码拉取到你们的本地去开发
+ git clone
面向对象编程:
了解面向对象编程思想,需要先了解对象、类、实例。万物皆对象,一切都可以看成对象,什么是类?比如咱们自然界中有很多的生物,咱们可以把这些生物分为:植物、动物。。。,那植物就是一个类,动物也是类,动物还可进行细分,比如:高级动物、低级动物,都是分类。什么是实例呢?比如说人类是一个分类,那具体的某个人,比如:丽丽就是一个人类中的一个实例,我想研究人类有哪些特点,就具体的拿这个人来研究就行。咱们在学习js的时候,也是按照这个思想去学习。
对象:万物皆对象
类:对象的具体细分,按照功能或者特征进行分类
实例:类中具体的一个事物(拿出具体的一个实例进行研究,当前类下的其它实例也会具有这些特点和特征)
面向对象: 面向对象是我们整个编程语言中的一个思想,在编程语言中,对象是一种泛指(一切研究的事物都是对象),我们按照一定的功能和特点,可以把它划分成大类和小类,而类中又有很多的实例,类给实例赋予了一些公有的属性方法而实例自身还可以有自身独有的一些属性和方法,这种伟大的思想就叫面向对象编程思想
一、单例设计模式:
单例模式:可以把描述一个事物的所有属性放到一个对象中,这样避免了相互的干扰,这就是单例设计模式普通单例模式
//普通
varname="刘亦菲";
varage=18;
varsex="女";
varname="胡歌";
varage=18;
varsex="男";
//单例
varobj1={
name:"刘亦菲",
age:18,
sex:"女"
}
varobj2={
name:"胡歌",
age:20,
sex:"男"
}
高级单例模式
varutils=(function(){
functionfn(){},
vara=2;
//... 在这个作用域中还有很多的变量和方法,
return{
// 想要把谁暴露出去,就放到这对象中
fn:fn
}
})();
console.log(nameSpace.fn)
二、工厂设计模式
把实现相同功能的代码进行封装,后期在使用的时候,只用调用这个函数即可,方便后期的“批量生产”。减少了页面中冗余的代码,实现了“高耦合低内聚”。
varperson1={
name:"lili",
age:18
}
varperson2={
name:"dava",
age:20
}
//....每次都需要重复的去写,很麻烦,所以就可以用工厂模式
functionperson(name,age){
return{
name:name,
age:age
}
}
person("lili","18")
person("dava","20")