JS笔记汇总

 

 

var声明可以在包含它的函数，模块，命名空间或全局作用域内部任何位置被访问（我们后面会详细介绍），包含它的代码块对此没有什么影响。 有些人称此为* var作用域或函数作用域*。 函数参数也使用函数作用域。

 

func.bind(newThis|| newObj):  将func函数内的this指向更改为newThis或newObj内的this

 

注释必须要多写！ 1.方便后台看 2.方便自己查错和优化

 

事先先沟通约定好，比如交互的数据格式需求是怎么样的啊，功能模块的逻辑是怎么样的等等。提前先和产品还有后台沟通好。

 

JSON内不能包含注释。 如果（某个）属性需要引号，则必须使用双引号。所有的属性名必须在双引号内。字符类型的属性值必须使用双引号。

 

 eval('(' + jsonstr + ')'); //可以将json字符串转换成json对象后执行,注意需要在json字符外包裹一对小括号

 

代码不运行，很可能是受其他代码影响，通常改成异步抓取，然后加一个闭包就可以了！

异步抓取：如setTimeout定时器

 

调用js函数的方式：

<div><a href="javascript:close();">×</a></div>

 

Sublime也可以编译es6，并直接显示js运行结果！

 

数据字典接口是用来查询各种数据，比如单位，类型，等等的

 

 

如上图，通过pid的方式实现树形结构父子关系！！,同一个pid的属于同一个父亲

 

 

注意； 每次文件删除或者增加都要重启tomcat！！！！,文件内部的更改不用！

 

 

看不懂别人代码的时候也可以用断点调试！ 因为不仅可以看到流程，还可以看到每个变量的数据！

 

a绑定事件无效，因为会跳转，需要设置href=javascript:;

 

$.extend(object1, object2); /* object2 合并到 object1 中 */

 

在线babel编译器：https://babeljs.io/repl

  2e2表示2*10^2=200 即 2*102=200

 

Yslow 性能优化插件 很好用！

 

 数值的前面带  0  表示 八进制

 Var num = 020;  

  0*80+2*81  = 16 

 数值的前面带  0x  表示 十六进制

  var result = 0xb;   11 

因为16进制是：0-9 a b ...f

 

 

缺省即默认的意思

 

日期转化：

$scope.begin_time = Date.parse($scope.begin_time)

new Date(1510838908000)

 

时间戳是指格林威治时间1970年01月01日00时00分00秒(北京时间1970年01月01日08时00分00秒)起至现在的总毫秒数

 

 //按照每个对象中的routeId属性进行排序

 routeList.sort(this.comp('a.routeId', 'b.routeId'));

 comp = (a, b) => {

   return new Function('a', 'b', 'return ' + a + '.localeCompare(' + b + ')');

 };

 

表格布局：

父：Display:table  子：display:table-cell

 

5.56789.toFixed(2);  5.57

toFixed() 方法可把 Number 四舍五入为指定小数位数的数字。

 

Math.min(n1,n2,n3,...,nX)

min() 方法可返回指定的数字中带有最小值的数字。

 

Set对象

ES6 提供了新的数据结构 Set。它类似于数组，但是成员的值都是唯一的，没有重复的值。

 const depotIdArray = Array.from(

 new Set([...batSelection.map(item => item.DepotId)])

 );

Array.from(object, mapFunction, thisValue)

 

import { Todo, TodoFilter } from "./";

 

var [, mumber4, ...others] =[1,2,3,4];

 

 

x=document.getElementsByName("myInput");

<input name="myInput" type="text"/>

 

xss攻击 cross site scripting

Underscore 库使用了解。模板输出时-和=的 区别

 

instanceof返回的是一个布尔值，如：

var a = {};

alert(a instanceof Object);  //true

instanceof只能用来判断对象和函数，不能用来判断字符串和数字等

 

add.call(sub,3,1); 这个例子中的意思就是用 add 来替换 sub，add.call(sub,3,1) == add(3,1) ，所以运行结果为：alert(4); 

 

Var divs = Array.prototype.slice.call(divs)  将伪数组转为真数组

 

   

arguments.callee 返回函数体本身

arguments.caller 返回函数的调用者

 

navigator.userAgent 判断是哪个浏览器

 

 

<input type=button value=后退+刷新

       onclick="window.history.go(-1);window.location.reload()">

 

history.forward() 前进

history.back() 回退

 

delete product.buy

isFinite(number) 函数用于检查其参数是否是无穷大/小。

如果 number 是有限数字（或可转换为有限数字）那么返回 true。否则，如果 number 是 NaN（非数字），或者是正、负无穷大的数，则返回 false。

 

架构师：宏观规划需要哪些对象，并且编写好比较难写的的对象

高级开发人员：实现对象

初级开发人员：使用对象

 

JS引擎：

chrome v8

webkit edge

ie 9- ie9-11 edge

 console.log(myString.substr(-6,3));//Scr  表示从倒数第6个开始截取，截取3个字符

 

Call() 借用： 供爷法则 被借的就是爷，必须放在前面

 

    /*eval 会将字符串当做js代码执行*/

    eval('var num=2')

console.log(num+2)  /*结果是4*/

 

对于动态数据的绑定：

1.如果代码简单 就用 "++" 绑定变量

2.如果代码稍复杂，就用formatString

3.如果比较复杂就用模板框架 如：arttemplate, underscore等。

 

模板就是合体法则：就是将数据和代码进行绑定：把代码里面的坑用真实的数据填充 -所以：模板框架必须支持传递两个参数：带坑的html，真实的数据-

 

 

 

编程的思路极其重要，思路理清了，代码很容易写且不会出错，思路没清楚，越写越乱，错漏百出，所以

1.首先必须把思路写下来，再三确认无误，搞清晰再写代码！

2.并把思路按模块写在代码注释中，可以大大缩短写代码和debug时间！

 

 

 

 

对象字面量即JSON：javascript对象表示法

 

关闭浏览器或者缩小浏览器的时候，都有可能触发析构函数 ，析构函数会回收内存

 

typeof null;//”object” 这是个公认的bug

 

变量存储在栈中，因为变量中存储的只是地址，真实的数据存储在堆中。 当把该变量赋值给另一个变量的时候，只是赋给了地址，而非真实数据。

 

 

 

有时候页面没效果可能是网页的缓存问题，清除下缓存，或者换个浏览器试试就知道了。

 

 

 

函数域解析比变量名提升优先级更高，即：函数会首先被提升，然后才是变量，也就是说函数会提升到变量上面

 

 

当对象的属性名中间有空格，或者“-”时，要用引号 把 属性名括起来

 

 

有时候"++" 不能输出变量而是输出字符串 而'++'却可以，注意区别！

 

 

html出现中文乱码的时候一般是meta标签描述的内容格式和文件格式不同，需要在sublime的文件-设置中文编码中选择与之相对应的charset

 

 

console.log(p1.constructor)     /*返回的是p1的构造函数本身 但是constructor 属性易变，不可信赖

 

 

 

有些好的英文原著虽然看不怎么懂，但是代码也值得看，然后辅助google 翻译  总会有所收获的

 

 

计算机世界只认识0和1

 

 

JSONP只能做GET请求，原因是JSONP核心是script实现的,而GET 请求 提交的数据有限

 

CORS: 被跨域的站点设置响应头  Access-Control-Allow-Origin 就能用ajax实现跨域

 

元素都支持load事件！很好用

script.addEventListener('load', function() {

      console.log(data);

});

 

XMLHttpRequest这个对象不支持跨域的请求 端口或域名不同都属于跨域

Polyfill: 对于不支持的浏览器的兼容方式

 

外层包一个div快捷键：Ctr + shift + G

 右键刷新按钮可清空缓存

 

 

 

跨域的几种常见的方式有：

jsonp

window.name+iframe

document.domain

postmessage

 

环境变量分为系统变量和用户变量

系统变量指的是所用当前系统用户共享的变量

- 自己的电脑一般只有一个用户

- 建议将自己配置的环境变量放在用户变量中，用户变量比较干净

只要添加到PATH变量中的路径，都可以在任何目录下搜索

 

 

break只能用于for循环，while循环，switch case 等中，不能用于函数中

 

      every 和 some 跟 forEach 一样都可以遍历数组

array.some( function(currentValue,index,arr),  thisValue)  返回布尔类型

 

程序调用自身的编程技巧称为递归（ recursion），递归是面试的重点！ 还有斐波那契数列

 

手机访问不了电脑的原因：

1.      不是同一个路由

2.      网段不同

3.      防火墙没有设置

 

 

 

RegExpObject.exec(string)

 

str.match(patt1)

 

 

if (!/^\w[\w_\d]{5,15}$/.test($scope.username)) {

 

校验参数合法化 简单优先原则(界面逻辑)

 

 

 window.addEventListener('hashchange',function(){ 监听hash改变事件

 

 

什么是闭包 一个具有封闭的对外不公开的空间, js中的闭包就是函数

 

        1.闭包基本模式

 

        在外部函数（foo）内创建函数(inner)，在这个内部函数(inner)中，可以操作foo中的数据

        将外部函数的返回值设置为内部函数

        在外部调用外部函数（foo）,就可以接受到返回值(内部函数)

        使用这个内部函数，就可以在外部对外部函数里的变量进行修改

 

 

     线程：一个线程一次只能处理一件事情，多个线程就可以多个事情同时进行

        JS是单线程的！

        JS中，分了三个任务

            1.渲染任务

            2.js的代码执行任务

            3.事件处理任务

 

 

有输入 有输出的都可以称之为API

Web API 主要是提供一些数据的,比如如下场景 ：

天气预报

导航

坐标转城市名

IP转城市名

 

提供webapi的网站： 聚合数据

案例： 百度地图案例,豆瓣电影案例 

用法如下

WebAPI:  http://api.itcast.cn/students/?id=10 => json (student info)

API:  Student.get(10) => student info

同样是输入10这个参数，然后输出（返回）一个数据。

 

 

不管是学习还是调错，看源码首先着眼于整体，这样便于理解，再深入去看细节。

 

压缩会把空格，换行，注释都去掉，如果选择js标识符混淆（通常称为js混淆

）, 就会把局部作用域的变量名（包括参数）也简化！