1.已知有字符串foo="get-element-by-id",寫一個(gè)function將其轉(zhuǎn)換成駝峰表示法"getElementById"
答案：
const foo = 'get-element-by-id';
const format = str =>{
return str.split('-').map((item,index)=>{
if(index === 0){
return item;
}else{
return item[0].toUpperCase() + item.substr(1);
}
}).join('');
}
console.log(format(foo));
2.var arr1=["a","c","m"],arr2=["k","u","y"];寫一段程序?qū)⑦@兩個(gè)數(shù)組合并且將合并后的第2個(gè)值刪除
答案：
var arr1 = ["a","c","m"],arr2 =["k","u","y"];
var arr3 = arr1.concat(arr2);
arr3.splice(1,1);
console.log(arr3);
4.寫一段程序，對(duì)二維數(shù)組求和：
const arr = [[1,2,3,4],[5,6,7,8,9,10]];
答案：
const arr =[[1,2,3,4],[5,6,7,8,9,10]];
const getTotal = arr => {
const newArr = arr.flat(); // - 數(shù)組扁平化
return newArr.reduce((pre,next) => {
return pre + next;
})
}
console.log(getTotal(arr));
注：flat()方法會(huì)按照一個(gè)可指定的深度遞歸遍歷數(shù)組，并將所有元素與遍歷到的子數(shù)組中的元素合并為一個(gè)新數(shù)組返回奇昙。
var newArray = arr.flat([depth])堪夭；
- 參數(shù) depth 可選
指定要提取嵌套數(shù)組的結(jié)構(gòu)深度奏黑，默認(rèn)值為 1威兜。 - 返回值
一個(gè)包含將數(shù)組與子數(shù)組中所有元素的新數(shù)組坑夯。
[reduce()方法詳細(xì)用法見(jiàn)：]JS中reduce的用法 - 簡(jiǎn)書 (jianshu.com)
- 封裝一個(gè)函數(shù)根據(jù)下面的地址欄進(jìn)行參數(shù)的提取使得參數(shù)變成一個(gè)對(duì)象
答案：
var url = 'http://localhost/baidawu/html/hotel.html?cityId=2&date_in=2016-05-10&date_out=2016-05-25&name=如家連鎖'涨共；
const getParams = str =>{
const obj = {};
str = str.substr(str.indexOf("?")+1).split("&").forEach(item => {
const key = item.split('=')[0];
const val = item.split('=')[1];
obj[key] = val;
})
return obj;
}
console.log(getParams(url));
- 請(qǐng)編寫代碼實(shí)現(xiàn)計(jì)算30天后的今天是星期幾纽帖？
答案：
//- 獲取當(dāng)前的日期對(duì)象
const nowData = new Date();
//- 重新指定日期對(duì)象
const setDate = new Date(nowData);
//- 設(shè)置新的日期對(duì)象的天數(shù)為30天之后
setDate.setDate(nowData.getDate()+30);
//- 獲取當(dāng)前的日期是星期幾
console.log(setDate.getDay());
6.下列哪些屬性不會(huì)觸發(fā)BFC?
A.overflow: hidden;
B.position: relative;
C.float: left;
D.position: absolute;
答案：B
注：
只要元素滿足下面任一條件即可觸發(fā) BFC 特性：
1.body 根元素
2.浮動(dòng)元素：float 除 none 以外的值
3.絕對(duì)定位元素：position (absolute、fixed)
4.display 為 inline-block举反、table-cells懊直、flex
5.overflow 除了 visible 以外的值 (hidden、auto火鼻、scroll)
- 從用戶的角度看元素的展示的顏色是什么室囊？
<style>
.f-1{
width:300px;
height:300px;
background-color:blue;
position:absolute;
z-index:2;
}
.f-2{
width:200px;
height:200px;
background-color:red;
position:absolute;
z-index:2;
}
.s-1{
width:100px;
height:100px;
heightground-color:green;
position:absolute;
z-index:5;
}
</style>
<div class="f-1">
<div class="s-1"></div>
</div>
<div class="f-2"></div>
答案：上：red , 中：green , 下：blue ;
8.不聲明其他變量雕崩，完成兩個(gè)變量值交換
var a=10;
var b=25;
答案：
var a = 10;
var b = 25;
a = a + b;
b = a - b;
a = a - b;
- link標(biāo)簽 與 @import的區(qū)別
答案：
（1）@import css2.1中提出的與否規(guī)則，link是html標(biāo)簽可以引入css樣式
（2）@import 加載css的方式在頁(yè)面完成后進(jìn)行加載融撞，link引入css文件是同時(shí)加載
（3）@import 兼容性 ie5+盼铁，link沒(méi)有兼容性問(wèn)題
- css中display屬性，block,inline,inline-block的區(qū)別
答案：
- block
（1）block元素會(huì)獨(dú)占一行尝偎，多個(gè)block元素會(huì)各自新起一行饶火。默認(rèn)情況下，block元素寬度自動(dòng)填滿其父元素寬度致扯。
（2）block元素可以設(shè)置wdth,height屬性肤寝。塊級(jí)元素即使設(shè)置了寬度，仍然是獨(dú)占一行抖僵。
（3）block元素可以設(shè)置margin和padding屬性鲤看。- inline
（1）inline元素不會(huì)獨(dú)占一行，多個(gè)相鄰的行內(nèi)元素耍群，多個(gè)相鄰的行內(nèi)元素會(huì)排列在同一行里刨摩，直到一行排列不下，才會(huì)新?lián)Q一行世吨，其寬度隨元素的內(nèi)容而變化澡刹。
（2）inline元素設(shè)置width,height屬性無(wú)效。
（3）inline元素的margin和padding屬性耘婚，水平方向的padding-left罢浇，padding-right，margin-left,margin-right都產(chǎn)生邊距效果沐祷；但豎直方向的padding-top嚷闭，padding-top，padding-bottom赖临，margin-top胞锰，margin-bottom不會(huì)產(chǎn)生邊距效果。- inline-block
同時(shí)具有inline 和 block的特點(diǎn)可以改變寬高兢榨，但是不會(huì)獨(dú)占整行嗅榕。
