本篇將會對js數組和字串以及函數進行講解。
陣列方法裡push、pop、shift、unshift、join、split分別是什麼作用
push:在陣列最後加上一個元素,語法是陣列.push (要加入的元素) ;，傳回值為陣列長度
pop: 刪除陣列最後一個元素，語法為陣列.pop( );傳回值為刪除的元素名稱
shift:刪除陣列第一個元素，語法為數組.shift( );返回值為刪除的元素名稱
unshift：在數組首位添加一個元素，後面元素向後偏移，語法為數組.unshift (所要添加的元素); ，傳回值為陣列長度
join:將陣列連接為字串，不修改原本的陣列,語法為陣列.join（），傳回值為連接完成的字串
split : 將字串分隔並變成數組，不修改原本的字串，語法為字串.split('分隔符號')；
程式碼：
用splice 實作push、pop 、shift、unshift 方法
splice實作push：
new1
[91, 3, 2, 1, 34, 5] //new1數組的元素new1.splice(new1. length,0,91) //new1.length代表數組最後一位後面，0為關鍵字添加，91為所要添加元素[]
new1
[91, 3, 2, 1, 34, 5, 91] //成功在陣列new1最後加上元素91
用splice實作pop：
new1
[91, 3, 2, 1, 34 , 5, 9, 91] //new1陣列的元素new1.splice(new1.length-1,1) //new1.length代表陣列最後一位，1為長度[91]
new1
[91, 3, 2, 1, 34, 5, 9] //成功刪除最後一位元素91
splice實現shift:
new1 91, 3, 2, 1, 34, 5, 645] //new1數組的元素new1.splice(0,1) //0代表數組下標索引數，1代表刪除個數[91] 的元素new1
[3, 2, 1, 34, 5, 645] # ##[3, 2, 1, 34, 5, 645] //new1陣列的元素new1.splice(0,0,91) //第一個0代表陣列下標索引數，第二個0為關鍵字添加，91為要添加的元素[]
new1
使用陣列拼接出如下字串
var prod = { name: '女装', styles: ['短款', '冬季', '春装']
};function getTp(data){ var new1 = prod.name; var new2 = prod.styles; var arrey =[];
arrey.push('<dl class="product">');
arrey.push("<dt>"+new1+"</dt>"); for(var i =0;i<new2.length;i++){
arrey.push("<dd>"+new2[i]+"</dd>")
}
arrey.push('</dl>'); console.log(arrey.join());
}
getTp(prod)//<dl class="product">,<dt>女装</dt>,<dd>短款</dd>,<dd>冬季</dd>,<dd>春装</dd>,</dl>var arr = [ "test" , 2 , 1.5 , false ]function find(arr,add){ for(var i = 0;i < arr.length; i++){ if(add==arr[i] && add !== 0){ return console.log(i)
}
} console.log(-1)
}
find(arr, "test") // 0find(arr, 2) // 1find(arr, 0) // -1arr = ["a", 1,3,5, "b", 2];var arre = [];function filterNumeric(arr){ for(var i= 0; i< arr.length;i++){ if(typeof arr[i]==='number'){
arre.push(arr[i])
}
} console.log(arre);
}
filterNumeric(arr) //[1, 3, 5, 2]var obj = { className: 'open menu'}; var shu = obj.className.split(" ");
function addClass(obj,nano){
for(var i = 0;i< shu.length; i++) {
if(shu[i] === nano) {
return console.log("因为"+nano+"已经存在，此操作无任何办法");
}
}
shu.push(nano);
//console.log(shu);
obj.className = shu.join(" "); console.log(obj);
}
addClass(obj, 'new'); //Object {className: "open menu new"}addClass(obj, 'open'); //因为open已经存在，此操作无任何办法addClass(obj, 'me'); // Object {className: "open menu new me"}console.log(obj.className); // open menu new mefunction removeClass(obj,habo){ //console.log(shu)
for(var i = 0;i<shu.length;i++){ if(shu[i] === habo) {
shu.splice(i,1);
}
}
obj.className = shu.join(' '); console.log(obj);
}
removeClass(obj,"open"); //Object {className: "menu new me"}removeClass(obj, 'blabla'); //Object {className: "menu new me"}function camelize(lama){ var lala = lama.split("-"); //["list", "style", "image"]
var a =[lala[0]]; for(var i =1; i<lala.length; i++) { var num =lala[i][0].toUpperCase(); //"S", "I"
var b = lala[i].replace(lala[i][0],num)
a.push(b)
}console.log(a.join(""))
}
camelize("background-color") //"backgroundColor"camelize("list-style-image") //"listStyleImage""arr = ["a", "b"];
arr.push( function() { alert(console.log('hello hunger valley')) } );
arr[arr.length-1]() //arr = ["a", 1 , 3 , 4 , 5 , "b" , 2];function filterNumericInPlace(arr){
for(var i= 0; 0< arr.length; i++) {
if( typeof arr[i] !== 'number'){
arr.splice(i,1)
}
} console.log(arr); // [1,3,4,5,2]}
filterNumericInPlace(arr);var john = { name: "John Smith", age: 23 };var mary = { name: "Mary Key", age: 18 };var bob = { name: "Bob-small", age: 6 };var people = [ john, mary, bob ];function ageSort(data){
data.sort(function (a,b){ return a.age-b.age;
}) console.log(data);
}
ageSort(people); // [ bob, mary, john ]function isNumeric (el){ return typeof el === 'number';
}
arr = ["a",3,4,true, -1, 2, "b"];function filter(arr, func){
for(var i =0;i<arr.length;i++){ if(!func(arr[i])){
arr.splice(i,1);
}
} return arr;
}
arr = filter(arr, isNumeric) ;console.log(arr);
arr = filter(arr,function(val){ return val > 0});console.log(arr);
[3, 4, -1, 2]
[3, 4, 2]function ucFirst(daho){ var add= daho[0].toUpperCase();
daho=daho.replace(daho[0],add) console.log(daho);
}
ucFirst("hunger")"Hunger"function truncate(str, maxlength){ if(str.length-1>maxlength){
add = str.substr(0,maxlength); console.log(add+"...");
}else{ return console.log(str);
}
}
truncate("hello, this is hunger valley,", 10)
truncate("hello world", 20)"hello, thi...""hello world"var num1 = 3.456;function limit2(num){
num=Math.round(num*100)/100; console.log(num);
}
limit2(num1)
limit2(2.42)3.462.42function habo(min,max){ console.log(Math.random()*(min-max)+max)
}
habo(5,15)function habo(min,max){
add = Math.random()*(min-max)+max; console.log(Math.round(add));
}
habo(5,12)function damo(len,min,max){
arr=[];
len == arr.length; for(var i =0;i<len;i++){
arr.push(Math.round(Math.random()*(min-max)+max));
} console.log(arr)
}
damo(5,18,70)
[53, 34, 43, 43, 33]關於JS時間物件和遞歸問題
一些CSS樣式基礎知識以上是JS數組、字串及數學函數的詳細內容。更多資訊請關注PHP中文網其他相關文章！
