前端小白的个人习惯和笔记(一)

快键键

已经敲代码这么久,分享一下自己的小习惯(可能有点乱有点杂)

win+S

  • 可以说是window用户的神器,可以随意开启全局的软件,配合cmd使用,alt+F4直接关闭这样就省下按鼠标的时间

ctrl+shift+tab

  • 在webstorm中快速打开本项目文件也可以直接打开cmd,不会打开webstorm自带的cmd我 习惯使用alt+F12

alt+tab

  • 这个切换窗口你们可以用的特别多,但是ctrl+alt+tab你们肯定用的少吧,这个你们用多了,就发现还是比alt+tab好用的,特别你开启很多窗口的时候

ctrl+shift+esc

  • 开启任务管理器你们肯定知道ctrl+alt+.可是我是68的键盘没有.表示很无奈

ctrl+w

  • 关闭网页用chrome浏览器用多了,蛋疼的是不能双击关闭网页,后来知道可以按滚纶关闭,但是,我鼠标不怎么样,还是这个比较方便

ctrl+c

  • 这个你不会以为我要跟你说复制,呵呵,这个是webstorm中回到行首,解决了一部分不喜欢的方向键的烦恼

ctrl+tab或ctrl+1,2,3

  • 快速切换浏览器窗口,可以只是强迫症来的时候用的多,或者吃饭一只手的时候可以用

直接上图

对于英语单词还是比较吃力的我,简直是我人生的福音,超超超级好用

phpstorm多窗口alt+窗口

  • 解决用习惯了webstorm快速转移phpstorm,当然少不了快键键了,直接上图

如果你要查看自己的id,直接在cmd输入ipconfig完美解决

下包

在用webstorm打开cmdalt+F12

npm init
npm install 包名  --save  //save把包信息放在package
dower install 包名  //直接在本文件夹下面生成包,你要是怕麻烦可以用这个下包工具

其实你也可以直接报npm的下载地址改成淘宝镜像,在安装路径npm文件夹下npmrc文件

ctrl+shift+F10 webstorm直接打开浏览器如果是js文件就会直接打开控制台

ctrl+A两次 在用oneNote的时候你会发现ctrl+A会全选一行内容,两次就会全选全部内容

F11 全屏--看视频专用

win+左/右 分屏,可以适合边看文档边敲代码

win+上 全屏

win+下 最小化(这个是不是很贴心又解决了用鼠标的烦恼呀)

Fn+F6 关闭电脑触屏版

  • 语法糖
    • 糖在不改变其所在位置的语法结构的前提下实现了运行时等价,之所以叫语法糖,是因为加糖后的代码写的很爽,代码更简洁流畅语义自然
    • 例如:for循环,三元表达式---

解决node_modules卡顿问题

如果觉得乱的话可以看下面的这张图简要的写了一下

Alt+F1第七个 所在的文件路径(最新版webstorm好像不行)

ctrl+shift+左.右 目录调大调小

ctrl+F12 查找定义多少函数等目录(这么高级的功能我还没怎么用过)

alt+左.右 窗口文件左右切换(这么好用还是经常忘记真的不应该)

Alt+1  打开关闭项目窗口

itar 遍历一个for循环

cc:ie6 兼容ie6(然后改成7,8就行了,不相当于兼容ie6,7,8)

自定义代码块保存路径 找到c盘安装目录config/template里面就是的

给桌面时间添加秒

学习篇

不管什么时候要不断保持学习的态度

再与产品经理打交道

  • 第三方选择

    • 你可以问清楚对方的真实需求,给出一个你可以做到的方案,而不是直接拒绝对方的方案

  • 在工作和生活中,不要把所有事情的解决方案都放在:不(第一选择,要赢)或者是(第二选择,认怂)上,如果只存在两种选择,很容易就进入一种推拉的环境中,实际上是可以考虑第三选择.

  • 第三选择并不是某一方的妥协,他的核心思想是创造力,找到新的出路,让双方协同找到一个大家都能接受的新方案

知识篇

js基础部分

一、         数据类型

1)       Number 数据类型

2)      String  字符串(双引号, 单引号)

3)      Boolean 布尔数据类型(true, false)

4)      undefined  变量未初始化(没有给变量赋值)

5)      null 变量未引用(值为空)

6)      object  对象     array 数组

二、         算术运算符

1)     两个数字类型变量相加或相减，得到一个数字类型

2)     一个数字类型和一个字符串相加，得到一个字符串

3)     一个数字类型和一个非数字类型的字符串得到NaN

三、         Math对象

1)     Math.ceil()  天花板函数  向上取整(1.1---2)

2)     Math.floor() 地板函数   向下取整(1.1---1)

3)     Math.max()   Math.min()

4)     Math.pow(n1,n2)    n1的n2次方

5)     Math.round()    四舍五入

6)     Math.random()   [0,1)的随机数

四、         数据类型转换

1.     数字类型转字符串

a)     Strong()    b)变量.toString()

1.     字符串转数字类型

  • Number()

    • 数字类型和小数类型字符串,转换成数字,
    • 非数字字符串,转换成NaN

  • parseInt()

    • 数字开头的字符串,转换之后得到前面的数字
    • 非数字---NaN    小数---取整

  • parseFloat

  • 跟parseInt同理,不同点是 小数---小数

1.     转布尔类型

  • Boolean()
  • 数字和字符串       true
  • undefined null  0   false

1.     逻辑运算符

  • &与  ||或   !非

  • 等号运算符

  • “==”  只判断内容不判断数据类型

  • “===” 判断内容还判断数字类型

  • “!==” 不仅判断内容还判断数字类型

  • 条件判断

  • If(条件){true内容}else

  • If(条件){true的内容false执行下面内容}else if(条件){true的内容}else{}

  • While(条件表达式)

  • Break语句    只要代码遇到break,程序立即停止

  • Continue      跳出本次循环,整个循环继续执行

  • Switch(条件)

  • 三元表达式

  • 表达式?true:false;

  • 优先级

    • ()优先级最高  一元运算符++  -- !
      • /  %  +    -

  • 如果我们想把函数内部的值赋值为外部,必须使用return;

  • 如果没有return或者return没有值,那么返回值都是undefined

//隐式全局变量

//隐式全局变量
function fn(){
    //b和c都是隐式全局变量
    var a = b = c = 1;
    //e和f都是隐式全局变量(分号相当于换行)
    var d = 1;e =2;f=3;
    //g和i都不是隐式全局变量
    var g = 1,h= 2,i=3;
}

  • 对象本身没有length,所以不能用for循环遍历

    11.	for(var k in aaa){
//        console.log(k);
//        //aaa.k代表aaa这个对象的k属性的值，并不是k对应的变量值的属性。
////        console.log(aaa.k);
//        //aaa[k],代表的是aaa这个对象中k这个变量值对应的属性值。
//        console.log(aaa[k]);
//    }

  • 在调用函数的时候，传参的过程其实就是用实参给形参赋值的过程

    • 当参数为值类型的时候，函数内和函数外的两个变量完全不同，仅仅只是存的值一样而已，修改时互不影响
    • 当参数为引用类型的时候，函数内和函数外的两个变量不同，但是共同指向同一个对象，在函数内修改对象数据时会影响外部
    var num = 1;
    fn1(num);
    console.log(num);
    function fn1(aaa){
        aaa = aaa*10;
    }
    //复杂数据类型
   var obj = new Object();
    obj.name = "张三";
   fn2(obj);
    console.log(obj);
    function fn2(object){
       object.name = "李四";
   }

五 判断数组和转换数组。

Instanceof:  是一个关键字。    判断A是否是B类型。

布尔类型值 = A Instanceof B ;

Array.isArray() //HTML5中新增    判断是不是数组

布尔类型值 = Array.isArray(变量) ;

调用者：Array            参数：变量(被检测值)          返回值：布尔类型

toString()       //把数组转换成字符串，每一项用,分割

字符串  =  数组.toString();

valueOf()       //返回数组对象本身

数组本身 = 数组.valueOf();

Join               //根据每个字符把数组元素连起来变成字符串

字符串  =  数组.join(变量);

变量可以有可以没有。不写默认用逗号分隔，无缝连接用空字符串。

六 数组增删和换位置（原数组讲被修改）

push()

  • 在数组最后面插入项，返回数组的长度

  • 数组1改后的长度  =  数组1.push(元素1);

pop()

  • 取出数组中的最后一项，返回最后一项

  • 被删除的元素 =  数组1.pop();

unshift()

  • 在数组最前面插入项，返回数组的长度

  • 数组1改后的长度  =  数组1.unshift(元素1);

shift()

  • 取出数组中的第一个元素，返回最后一项

  • 被删除的元素  =  数组1.shift();

reverse()

  • 翻转数组（原数组讲呗反转，返回值也是被反转后的数组）

  • 反转后的数组 =  数组1.reverse();

sort();

  • 给数组排序，返回排序后的数组。如何排序看参数。

  • 从小到大排序后的数组 =  数组1.sort(function(a,b){   return a-b;});

  • 无参：按照数组元素的首字符对应的Unicode编码值从小到大排列数组元素。

  • 带参：必须为函数（回调函数--callback）。函数中带有两个参数，代表数组中的          前后元素。如果计算后（a-b），返回值为负数，a排b前面。等于0不动。        返回值为正数，a排b后面。

concat()

  • 把参数拼接到当前数组

  • 新数组 = 数组1.concat(数组2);

slice()

  • 从当前数组中截取一个新的数组，不影响原来的数组，参数start从0开始,end从1开始

  • 新数组 = 数组1.slice(索引1，索引2);

splice()

  • 删除或替换当前数组的某些项目，参数start,deleteCount,options(要替换的项目)

  • 新数组 = 数组1.splice(起始索引，结束索引，替换内容);

indexOf()、lastIndexOf()

  • 如果没找到返回-1

  • 索引值 = 数组.indexOf/lastIndexOf(数组中的元素);

迭代方法 不会修改原数组

every()、filter()、forEach()、map()、some()

数组/boolean/无 = 数组.every/filter/forEach/map/some(
                            function(element,index,arr){
        									程序和返回值；				          
   }
);

这个属于ES6的内容我还是在后面详细介绍吧

清空数组

var array = [1,2,3,4,5,6];

array.splice(0,array.length); //删除数组中所有项目

array.length = 0; //length属性可以赋值，其它语言中length是只读

array = [];  //推荐

posted @ 2018-02-16 15:13  猫神甜辣酱  阅读(1793)  评论(7)  编辑  收藏  举报