前端最大整数长度

4294967295。Number对象是采用64位存储的,即8个字节 8位 = 64位

*** 作符在 *** 作Number类型时,实际是 *** 作的32位(位运算那一节介绍的)

在底层再把32位转换成64位进行处理。最大的整数就是2的32次方减1

即 2 32 - 1

书上在介绍数组索引时也能佐证,因为数组的索引是整数,最大的索引就是 2 32 - 1 即4294967295。

今天小编要跟大家分享的文章是关于Web前端工程师应该知道的JavaScript使用小技巧。任何一门技术在实际中都会有一些属于自己的小技巧。同样的，在使用JavaScript时也有一些自己的小技巧，只不过很多时候有可能容易被大家忽略。而在互联网上，时不时的有很多同行朋友会总结(或收集)一些这方面的小技巧。

今天在这篇文章中，小编会整理一些大家熟悉或不熟悉的有关于JavaScript的小技巧，希望能够对大家的学习和工作有所帮助。

一、数组

先来看使用数组中常用的一些小技巧。

01、数组去重

ES6提供了几种简洁的数组去重的方法，但该方法并不适合处理非基本类型的数组。对于基本类型的数组去重，可以使用new

Set()来过滤掉数组中重复的值，创建一个只有唯一值的新数组。

constarray=[1,1,2,3,5,5,1]

constuniqueArray=[newSet(array)];

consolelog(uniqueArray);

>Result:(4)[1,2,3,5]

这是ES6中的新特性，在ES6之前，要实现同样的效果，我们需要使用更多的代码。该技巧适用于包含基本类型的数组：undefined、null、boolean、string和number。如果数组中包含了一个object,function或其他数组，那就需要使用另一种方法。

除了上面的方法之外，还可以使用Arrayfrom(newSet())来实现：

constarray=[1,1,2,3,5,5,1]

Arrayfrom(newSet(array))

>Result:(4)[1,2,3,5]

另外，还可以使用Array的filter及indexOf()来实现：

constarray=[1,1,2,3,5,5,1]

arrayfilter((arr,index)=>arrayindexOf(arr)===index)

>Result:(4)[1,2,3,5]

注意，indexOf()方法将返回数组中第一个出现的数组项。这就是为什么我们可以在每次迭代中将indexOf()方法返回的索引与当索索引进行比较，以确定当前项是否重复。

02、确保数组的长度

在处理网格结构时，如果原始数据每行的长度不相等，就需要重新创建该数据。为了确保每行的数据长度相等，可以使用Arrayfill来处理：

letarray=Array(5)fill('');

consolelog(array);

>Result:(5)["","","","",""]

03、数组映射

不使用Arraymap来映射数组值的方法。

constarray=[

{

ame:'大漠',

email:'w3cplus@#'

},

{

ame:'Airen',

email:'airen@#'

}

]

constname=Arrayfrom(array,({name})=>name)

>Result:(2)["大漠","Airen"]

04、数组截断

如果你想从数组末尾删除值(删除数组中的最后一项)，有比使用splice()更快的替代方法。

例如，你知道原始数组的大小，可以重新定义数组的length属性的值，就可以实现从数组末尾删除值：

letarray=[0,1,2,3,4,5,6,7,8,9]

consolelog(arraylength)

>Result:10

arraylength=4

consolelog(array)

>Result:(4)[0,1,2,3]

这是一个特别简洁的解决方案。但是，slice()方法运行更快，性能更好：

letarray=[0,1,2,3,4,5,6,7,8,9];

array=arrayslice(0,4);

consolelog(array);

>Result:[0,1,2,3]

05、过滤掉数组中的falsy值

如果你想过滤数组中的falsy值，比如0、undefined、null、false，那么可以通过map和filter方法实现：

constarray=[0,1,'0','1','大漠','#',undefined,true,false,null,'undefined','null',NaN,'NaN','1'+0]

arraymap(item=>{

returnitem

})filter(Boolean)

>Result:(10)[1,"0","1","大漠","#",true,"undefined","null","NaN","10"]

06、获取数组的最后一项

数组的slice()取值为正值时，从数组的开始处截取数组的项，如果取值为负整数时，可以从数组末属开始获取数组项。

letarray=[1,2,3,4,5,6,7]

constfirstArrayVal=arrayslice(0,1)

>Result:[1]

constlastArrayVal=arrayslice(-1)

>Result:[7]

consolelog(arrayslice(1))

>Result:(6)[2,3,4,5,6,7]

consolelog(arrayslice(arraylength))

>Result:[]

正如上面示例所示，使用arrayslice(-1)获取数组的最后一项，除此之外还可以使用下面的方式来获取数组的最后一项：

consolelog(arrayslice(arraylength-1))

>Result:[7]

07、过滤并排序字符串列表

你可能有一个很多名字组成的列表，需要过滤掉重复的名字并按字母表将其排序。

在我们的例子里准备用不同版本语言的JavaScript

保留字的列表，但是你能发现，有很多重复的关键字而且它们并没有按字母表顺序排列。所以这是一个完美的字符串列表(数组)来测试我们的JavaScript小知识。

varkeywords=['do','if','in','for','new','try','var','case','else','enum','null','this','true','void','with','break','catch','class','const','false','super','throw','while','delete','export','import','return','switch','typeof','default','extends','finally','continue','debugger','function','do','if','in','for','int','new','try','var','byte','case','char','else','enum','goto','long','null','this','true','void','with','break','catch','class','const','false','final','float','short','super','throw','while','delete','double','export','import','native','public','return','static','switch','throws','typeof','boolean','default','extends','finally','package','private','abstract','continue','debugger','function','volatile','interface','protected','transient','implements','instanceof','synchronized','do','if','in','for','let','new','try','var','case','else','enum','eval','null','this','true','void','with','break','catch','class','const','false','super','throw','while','yield','delete','export','import','public','return','static','switch','typeof','default','extends','finally','package','private','continue','debugger','function','arguments','interface','protected','implements','instanceof','do','if','in','for','let','new','try','var','case','else','enum','eval','null','this','true','void','with','await','break','catch','class','const','false','super','throw','while','yield','delete','export','import','public','return','static','switch','typeof','default','extends','finally','package','private','continue','debugger','function','arguments','interface','protected','implements','instanceof'];

因为我们不想改变我们的原始列表，所以我们准备用高阶函数叫做filter，它将基于我们传递的回调方法返回一个新的过滤后的数组。回调方法将比较当前关键字在原始列表里的索引和新列表中的索引，仅当索引匹配时将当前关键字push到新数组。

最后我们准备使用sort方法排序过滤后的列表，sort只接受一个比较方法作为参数，并返回按字母表排序后的列表。

在ES6下使用箭头函数看起来更简单:

constfilteredAndSortedKeywords=keywords

filter((keyword,index)=>keywordslastIndexOf(keyword)===index)

sort((a,b)=>a

这是最后过滤和排序后的JavaScript保留字列表：

consolelog(filteredAndSortedKeywords);

>Result:['abstract','arguments','await','boolean','break','byte','case','catch','char','class','const','continue','debugger','default','delete','do','double','else','enum','eval','export','extends','false','final','finally','float','for','function','goto','if','implements','import','in','instanceof','int','interface','let','long','native','new','null','package','private','protected','public','return','short','static','super','switch','synchronized','this','throw','throws','transient','true','try','typeof','var','void','volatile','while','with','yield']

08、清空数组

如果你定义了一个数组，然后你想清空它。通常，你会这样做：

letarray=[1,2,3,4];

functionemptyArray(){

array=[];

}

emptyArray();

但是，这有一个效率更高的方法来清空数组。你可以这样写:

letarray=[1,2,3,4];

functionemptyArray(){

arraylength=0;

}

emptyArray();

09、拍平多维数组

使用运算符，将多维数组拍平：

10、从数组中获取最大值和最小值

可以使用Mathmax和Mathmin取出数组中的最大小值和最小值：

constnumbers=[15,80,-9,90,-99]

constmaxInNumbers=Mathmaxapply(Math,numbers)

constminInNumbers=Mathminapply(Math,numbers)

consolelog(maxInNumbers)

>Result:90

consolelog(minInNumbers)

>Result:-99

另外还可以使用ES6的运算符来完成：

constnumbers=[1,2,3,4];

Mathmax(numbers)

>Result:4

Mathmin(numbers)

>>Result:1

二、对象

在 *** 作对象时也有一些小技巧。

01、使用运算符合并对象或数组中的对象

同样使用ES的运算符可以替代人工 *** 作，合并对象或者合并数组中的对象。

//合并对象

constobj1={

ame:'大漠',

url:'#'

}

constobj2={

ame:'airen',

age:30

}

constmergingObj={obj1,obj2}

>Result:{name:"airen",url:"#",age:30}

//合并数组中的对象

constarray=[

{

ame:'大漠',

email:'w3cplus@#'

},

{

ame:'Airen',

email:'airen@#'

}

]

constresult=arrayreduce((accumulator,item)=>{

return{

accumulator,

[itemname]:itememail

}

},{})

>Result:{大漠:"w3cplus@#",Airen:"airen@#"}

02、有条件的添加对象属性

不再需要根据一个条件创建两个不同的对象，以使它具有特定的属性。为此，使用 *** 作符是最简单的。

constgetUser=(emailIncluded)=>{

return{

ame:'大漠',

blog:'w3cplus',

emailIncluded&&{email:'w3cplus@#'}

}

}

constuser=getUser(true)

consolelog(user)

>Result:{name:"大漠",blog:"w3cplus",email:"w3cplus@#"}

constuserWithoutEmail=getUser(false)

consolelog(userWithoutEmail)

>Result:{name:"大漠",blog:"w3cplus"}

03、解构原始数据

你可以在使用数据的时候，把所有数据都放在一个对象中。同时想在这个数据对象中获取自己想要的数据。

在这里可以使用ES6的Destructuring特性来实现。比如你想把下面这个obj中的数据分成两个部分：

constobj={

ame:'大漠',

blog:'w3cplus',

email:'w3cplus@#',

joined:'2019-06-19',

followers:45

}

letuser={},userDetails={}

({name:username,email:useremail,userDetails}=obj)

>{name:"大漠",blog:"w3cplus",email:"w3cplus@#",joined:"2019-06-19",followers:45}

consolelog(user)

>Result:{name:"大漠",email:"w3cplus@#"}

consolelog(userDetails)

>Result:{blog:"w3cplus",joined:"2019-06-19",followers:45}

04、动态更改对象的key

在过去，我们首先必须声明一个对象，然后在需要动态属性名的情况下分配一个属性。在以前，这是不可能以声明的方式实现的。不过在ES6中，我们可以实现：

constdynamicKey='email'

letobj={

ame:'大漠',

blog:'w3cplus',

[dynamicKey]:'w3cplus@#'

}

consolelog(obj)

>Result:{name:"大漠",blog:"w3cplus",email:"w3cplus@#"}

05、判断对象的数据类型

使用ObjectprototypetoString配合闭包来实现对象数据类型的判断：

constisType=type=>target=>`[object${type}]`===ObjectprototypetoStringcall(target)

constisArray=isType('Array')([1,2,3])

consolelog(isArray)

>Result:true

上面的代码相当于：

functionisType(type){

returnfunction(target){

return`[object${type}]`===ObjectprototypetoStringcall(target)

}

}

isType('Array')([1,2,3])

>Result:true

或者：

constisType=type=>target=>`[object${type}]`===ObjectprototypetoStringcall(target)

constisString=isType('String')

constres=isString(('1'))

consolelog(res)

>Result:true

06、检查某对象是否有某属性

当你需要检查某属性是否存在于一个对象，你可能会这样做：

varobj={

ame:'大漠'

}

if(objname){

consolel

JavaScript中的Array类型很灵活，和C语言不同，同一个Array每个位置可以存储不同的变量类型，而且数组长度可变。

声明数组的方法：

var colors = new Array() ;

var colors = new Array(20) ;//长度为20的数组

var colors = new Array("red","blue","green") ;

var colors = ["red","blue","green"] ;

var colors = Array(3) ;

var colors = Array("bue") ;

arrayslength 可以获取colors数组的长度。这个长度不是只读的，而是可变的！

var arrays = ["red","blue","green"] ; // 有三个元素，长度为3

arrayslength = 2 ; //将arrays数组长度设为2后

alert(arrays[2]) ; //Undefined 第三个元素为Undefined

将长度增大或者缩短之后超出原来数组长度或者小于新数组长度的部分的值为undefined

检测当前对象事都是数组的方法：

if(value instanceif Array){

}

if(ArrayisArray(value)){

}

value为要检测的对象

JavaScript的数组可以当做栈来处理，也可以当做队列或者双向队列处理，甚至能把栈，队列，双向队列的特点和方法集合起来。

我们可以用下面的一些方法来对数组进行任意的插入删除 *** 作。

栈方法：后进先出

push() ：方法可以接收任意数量的参数，把他们添加到数组末尾，并返回修改后数组的长度。

pop() ：方法则从数组末尾移除最后一项，减少数组的length，然后返回移除的项。

队列方法：先进先出

shift()：移除数组中的第一个项并返回该项，长度减1

结合使用shift()和push()方法，可以想使用队列一样使用数组，后端添加，前端删除

Unshift()：在数组前端添加任意个项并返回新数组的长度

结合使用unshift()和pop()方法，从相反的方向来模拟队列，即在数组的前端添加项，在后端移除

var colors = new Array() ;

var count = colorspush("red","green") ;

alert(count) ;//2

var item = colorsshift() ; //队列出队 *** 作

alert(item) ;//"red"

colorsunshift("red") ; //从前边插入

重排序方法：

sort()方法：

sort在排序时都用toString把数据转换成字符串形式：

var values = [0,1,5,10,15] ;

valuessort() ;

alert(values) ;// 0 ,1 ,10, 15 ,5 ;

要实现对数的排序，需要写一个比较函数：

function compare(value1,value2){

if(value1 < value2){

return -1 ;

}else if(value1 > value2){

return 1 ;

}else return 0 ;

}

valuessort(compare) ;

reverse()方法：反转数组项的顺序

*** 作方法：

1、contact（）：基于当前数组中的所有项创建一个新数组，而不是在当前数组上直接拼接。

colorscontact(["black","yellow"]) ;//contact用来拼接数组，把参数数组拼接到colors的后面

2、slice（）：基于当前数组中的一个或多个项创建一个新数组，可接收一或两个参数，即要返回项的起始和结束位置。若参数中有一个负数，则用数组长度加上该数来确定相应的位置

var colors = ["red","blue","green"] ;

var colors2 = colorsslice(1) ; //返回从数组下标1到最后缩构成的一个数组

var colors3 = colorsslice(1,4) ; //

返回从数组下标1--3构成的一个数组

3、splice()方法：删除、插入、替换

删除：当splice方法指定两个参数时，colorsplice(1,3)表明删除从下标1开始连续三项

插入：当splice指定三个参数：起始位置、0、插入的项，colorsplice(2,0,"red","green") 表明从下标2开始插入“red”和“green”

替换：colorsplice(1,2,"red","green") 表明先删除下标1开始的连续两项，在从下标1开始插入“red”和“green”

位置方法：

indexOf()方法：

colorsindexOf(value) 从数组开头开始查找value，返回value的下标，如果没找到返回-1 。在查找时要求严格查找，相当于===

lastIndexOf()方法：从数组的末尾开始向前查找

今天小编要跟大家分享的文章是关于Web前端工程师要掌握的JavaScript代码片段(一)。正在从事web前端工作的小伙伴们来和小编一起看一看吧，希望本篇文章能够对正在从事web前端工作的小伙伴们有所帮助。

1、Anagramsofstring(带有重复项)

使用递归。对于给定字符串中的每个字母，为字母创建字谜。使用map()将字母与每部分字谜组合，然后使用reduce()将所有字谜组合到一个数组中，最基本情况是字符串长度等于2或1。

constanagrams=str=>{

if(strlength[str];

returnstrsplit('')reduce((acc,letter,i)=>

accconcat(anagrams(strslice(0,i)+strslice(i+1))map(val=>

letter+val)),[]);

};

//anagrams('abc')->['abc','acb','bac','bca','cab','cba']

2、数组平均数

使用reduce()将每个值添加到累加器，初始值为0，总和除以数组长度。

constaverage=arr=>arrreduce((acc,val)=>acc+val,0)/

arrlength;

//average([1,2,3])->2

3、大写每个单词的首字母

使用replace()匹配每个单词的第一个字符，并使用toUpperCase()来将其大写。

constcapitalizeEveryWord=str=>strreplace(/\b[a-z]/g,char=>

chartoUpperCase());

//capitalizeEveryWord('helloworld!')->'HelloWorld!'

4、首字母大写

使用slice(0,1)和toUpperCase()大写第一个字母，slice(1)获取字符串的其余部分。省略lowerRest参数以保持字符串的其余部分不变，或将其设置为true以转换为小写。(注意：这和上一个示例不是同一件事情)

constcapitalize=(str,lowerRest=false)=>

strslice(0,1)toUpperCase()+(lowerReststrslice(1)toLowerCase():

strslice(1));

//capitalize('myName',true)->'Myname'

5、检查回文

将字符串转换为toLowerCase()，并使用replace()从中删除非字母的字符。然后，将其转换为tolowerCase()，将('')拆分为单独字符，reverse()，join('')，与原始的非反转字符串进行比较，然后将其转换为tolowerCase()。

constpalindrome=str=>{

consts=strtoLowerCase()replace(/[\W_]/g,'');

returns===ssplit('')reverse()join('');

}

//palindrome('tacocat')->true

6、计数数组中值的出现次数

每次遇到数组中的特定值时，使用reduce()来递增计数器。

constcountOccurrences=(arr,value)=>arrreduce((a,v)=>v===

valuea+1:a+0,0);

//countOccurrences([1,1,2,1,2,3],1)->3

7、当前URL

使用windowlocationhref来获取当前URL。

constcurrentUrl=_=>windowlocationhref;

//currentUrl()->'>

（1）字符串就是零个或多个排在一起的字符。

（2）放在单引号或双引号之中。 'abc' "abc"。

（3）单引号字符串的内部，可以使用双引号。

（4）双引号字符串的内部，可以使用单引号。

（5）反引号`` ：反引号允许跨行。

反引号允许字符串跨越多行并可以使用

${…} 在字符串中嵌入表达式。

（1）charAt 方法返回指定位置的字符，参数是从0开始编号的位置。

找一个字符串中的某个位置是那个字符串。

charCodeAt：返回字符串指定位置的 Unicode 码点（十进制表示）

（2）[]

字符串可以被视为字符串数组，因此可以用数组的方括号运算符，用来返回某个位置的字符

但是字符串只是数组的相似性而已实际上、没办法改变字符串中的某个字符

length 只是返回了字符串的长度，该属性没办法改变

字符串使用Unicode字符集，js内部所有的都是Unicode表示的。

JavaScript中的字符串使用的是 UTF-16 编码。

toLowerCase() 和 toUpperCase()方法可以改变大小写。

String对象是js原生提供的三个包装对象之一。用来生成字符串对象。

（1）构造函数

字符串对象是一个类数组对象，很像数组，但不是真正的数组。

（2）将任意的值转成字符

用于连接两个字符串，返回一个新字符串，不改变原字符串。

从原字符串取出子字符串并返回，不改变原字符串。

它的第一个参数是子字符串的开始位置，

第二个参数是子字符串的结束位置（不含该位置）。

如果省略第二个参数，则表示子字符串一直到原字符串结束。

用于从原字符串取出子字符串并返回，不改变原字符串，跟slice方法很相像。

它的第一个参数表示子字符串的开始位置，

第二个位置表示结束位置（返回结果不含该位置）

如果省略第二个参数，则表示子字符串一直到原字符串结束。

区别：slice 和 substring的区别？

slice：

如果参数是负值，表示从结尾开始倒数计算的位置，即该负值加上字符串长度。

如果第一个参数大于第二个参数（正数情况下），slice()方法返回一个空字符串。

substring：

如果第一个参数大于第二个参数，substring方法会自动更换两个参数的位置。

如果参数是负数，substring方法会自动将负数转为0。

由于这些规则违反直觉，因此不建议使用substring方法，应该优先使用slice。

总结：获取子字符串，使用 slice 或 substring。

用于确定一个字符串在另一个字符串中第一次出现的位置，

返回结果是匹配开始的位置。如果返回-1，就表示不匹配。

indexOf方法还可以接受第二个参数，表示从该位置开始向后匹配。

lastIndexOf

lastIndexOf方法的用法跟indexOf方法一致，主要的区别是lastIndexOf从尾部开始匹配，indexOf则是从头部开始匹配。

总结：查找子字符串时，使用 indexOf 或 includes/startsWith/endsWith 进行简单检查。

endsWith 用来判断当前字符串是否是以另外一个给定的子字符串“结尾”的，根据判断结果返回 true 或 false。

用于去除字符串两端的空格，返回一个新字符串，不改变原字符串。

toLowerCase方法用于将一个字符串全部转为小写，

toUpperCase则是全部转为大写。

它们都返回一个新字符串，不改变原字符串

split方法按照给定规则分割字符串，返回一个由分割出来的子字符串组成的数组。

如果分割规则为空字符串，则返回数组的成员是原字符串的每一个字符。

如果省略参数，则返回数组的唯一成员就是原字符串。

split方法还可以接受第二个参数，限定返回数组的最大成员数。

返回一个新字符串，表示将原字符串重复n次。

字符串补全长度的功能。如果某个字符串不够指定长度，

会在头部或尾部补全。padStart()用于头部补全，padEnd()用于尾部补全。

trimStart()消除字符串头部的空格，

trimEnd()消除尾部的空格。

返回一个由替换值（replacement）替换部分或

所有的模式（pattern）匹配项后的新字符串。

模式可以是一个字符串或者一个正则表达式，

替换值可以是一个字符串或者一个每次匹配都要调用的回调函数。

如果pattern是字符串，则仅替换第一个匹配项

web前端笔记4-有讲 如果感兴趣、请参考之前文章

第一步：定义cs数组

cs文件里后台程序中要有数组，这个数组要定义成公共的数组。

public string[] lat = null;

public string[] lng = null;

第二步：给cs数组赋值

cs数组的值一般都是从数据库中取到的，也可以自己定义

第三步：将cs数组赋给前端的js数组

这个步骤是关键，选用的方法就是<%=cs数组%>。这样模糊的说法也是百度得到的，赋值会用到循环，即会一个元素一个元素的赋值。

示例：

后台cs代码

using System;  

using SystemCollectionsGeneric;  

using SystemLinq;  

using SystemWeb;  

using SystemWebUI;  

using SystemWebUIWebControls;  

using SystemDataOleDb;  

using SystemData;  

using SystemCollections;  

  

public partial class VideoSource : SystemWebUIPage  

{  

    public string[] lat = null;//存放纬度值  

  public string[] lng = null;//存放经度值  

  public int lng_len = 0;//用于获得数组长度  

  public int k = 0;//用于赋值循环  

  protected void Page_Load(object sender, EventArgs e)  

  {  

      ArrayList lng_list = new ArrayList();  

    ArrayList lat_list = new ArrayList();  

    OleDbConnection con = new OleDbConnection(@"Provider=MicrosoftACEOLEDB120;Data Source=" + ServerMapPath("App_Data/Database1accdb"));  

    conOpen();  

    string sql = "select  from tb_videos";  

    try  

    {  

        OleDbDataAdapter gh = new OleDbDataAdapter(sql, con);  

      DataSet ds = new DataSet();  

      ghFill(ds);  

      conClose();  

      foreach (DataRow DR in dsTables[0]Rows)  

      {  

        lng_listAdd(DR[2]ToString());  

        lat_listAdd(DR[3]ToString());  

      }  

    }  

    catch  

    {  

      conDispose();  

    }  

    lng = (string[])lng_listToArray(typeof(string));  

    lat = (string[])lat_listToArray(typeof(string));  

    lng_len = lng_listCount;  

}

前台aspx代码

<script type="text/javascript">  

var jingdu = new Array();  

var weidu = new Array();  

<%  

for(int k=0;k<lng_len;k++){  

%>  

jingdupush("<%=lng[k]%>");  

    weidupush("<%=lat[k]%>");  

    <%  

}  

%>  

var latlng=[];  

for(var i=0;i<jingdulength;i++){  

    latlngpush(new googlemapsLatLng(jingdu[i],weidu[i]));  

}  

</script>

2019-05-14

当对象数组长度较大时，PHP后端获取的POST数据不完整

phpini中max_input_vars 参数默认为1000 改为5000解决

也可使用JSONstringify转换为JSON字符串传到后端，后端解析后再处理

以上就是关于前端最大整数长度全部的内容，包括:前端最大整数长度、Web前端工程师应该知道的JavaScript使用小技巧、JS中的 Array 类是否有 add方法等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！