フロントエンドの面接基本質問30問-1
-
-
- 1.CSSの位置によってどのような値が取れるのか、その違いは何なのか
- 2. セマンティクスを理解する方法
- 3. JavaScript のデータ型とは何ですか
- 4. イベントキャプチャとイベントバブリングについて説明する
- 5. 一般的に使用される配列メソッドは何ですか。少なくとも 5 つのメソッドとその機能をリストしてください。
- 6. Vue の v-if 命令と v-show 命令の違いは何ですか
- 7. Vue の v-text と v-html の違いと、 { { }} 構文の特徴は何ですか
- 8.MVVMの導入
- 9. ボックスモデルについてのあなたの理解を話してください
- 10. JavaScript で typeof 演算子を使用すると、どのような結果が得られますか?
- 11. 一般的に使用される文字列メソッドを少なくとも 5 つ挙げて、その機能を説明してください
- 12. Vue コンポーネントのデータが関数である必要があるのはなぜですか
- 13. Vue2.x 双方向バインディングの原理は何ですか
- 14. CSS セレクターとは何ですか、またその優先順位は何ですか
- 15. 式が配列であるかどうかを判断する方法は何ですか?
- 16. v-if と v-for は一緒に使用できますか? はいの場合は優先順位を、そうでない場合はその理由を説明してください
- 17. Vue.nextTick() は何をしますか?
- 18. CSS で中央揃えを実現する方法は何ですか。少なくとも 3 つ書いてください。
- 19. イベントのバブリングとデフォルトの動作を防ぐ方法、標準メソッドを作成する
- 20. Vue コンポーネントのライフサイクル フックは何ですか?
- 21. CSS導入時のlinkと@importの違い
- 22. JavaScriptにおけるcallとapplyの機能と違い
- 23. Promise の状態とその意味は何ですか?
- 24. VueRouter が使用するルーティング モード
- 25. プログラムによるナビゲーションを実装するために VueRouter が呼び出せるメソッドは何ですか
- 26. 特定の数値の階乗演算を実現する再帰関数を作成します (5! = 5 * 4 * 3 * 2 * 1)。
- 27. Vue2.x のフィルターの機能とその定義方法は何ですか?
- 28. VueRouter はルートの遅延読み込みをどのように実装しますか
- 29. エムとレムの違い
- 30. 配列要素の重複排除を実装する方法。実現するための 3 つのメソッドを書いてください。
-
1.CSSの位置によってどのような値が取れるのか、その違いは何なのか
static(默认值):默认值,没有定位
relative(相对定位):相对于自身的位置进行定位
absolute(绝对定位):相对于有定位属性的父元素进行定位
fixed(固定定位):相对于浏览器窗口进行定位
sticky(黏性定位):在没有到达指定位置时没有定位,到达位置后就会变成固定模式
2. セマンティクスを理解する方法
易读性和维护性更好
SEO成分会更好,蜘蛛抓取更好
3. JavaScript のデータ型とは何ですか
基本数据类型:string、number、boolean、undefined、null、symbol、biginit
引用类型:object
4. イベントキャプチャとイベントバブリングについて説明する
事件冒泡:事件冒泡就是在一个对象上绑定事件,如果定义了事件的处理程序,就会调用处理程序。相反没有定义的话,这个事件会向对象的父级传播,知道事件被执行,最后到达最外层document对象上。
事件捕获:和事件冒泡是一个相反的过程,首先在document上找,有事件得到话就执行,没有一直往里面找,一直到到所点击的对象上的事件
5. 一般的に使用される配列メソッドは何ですか。少なくとも 5 つのメソッドとその機能をリストしてください。
foreach:遍历数值,没有返回值
map:遍历数组中,有返回值
some:遍历数组中,只要有一个满足条件就返回true
every:只有当全部满足条件的时候才返回true
splice:可以用来截取、替换、删除数组中的元素
6. Vue の v-if 命令と v-show 命令の違いは何ですか
v-if是直接控制DOM是否渲染,v-show是通过控制css样式是否显示,在经常需要显示隐藏的时候时候v-show
7. Vue の v-text と v-html の違いと、 { { }} 構文の特徴は何ですか
v-text不能解析html标签,v-html能解析标签,
{
{}}语法特点:拼接
算术运算
三元运算
能在控制台打印都能写在里面
8.MVVMの導入
M:模型
V:视图
VM:视图模型
9. ボックスモデルについてのあなたの理解を話してください
我们把盒模型分为了标准盒模型和怪异盒模型,其中标准盒模型的宽高就等于内容的宽高,而怪异盒模型的宽高包含了padding和border
10. JavaScript で typeof 演算子を使用すると、どのような結果が得られますか?
number string boolean object function
11. 一般的に使用される文字列メソッドを少なくとも 5 つ挙げて、その機能を説明してください
length:获取字符串的长度、
chartAt():返回指定位置的字符
indexOf():查找某个字符,有则返回第一次匹配到的位置,否则返回-1
lastindexOf():查找某个字符,有则返回最后一次匹配到的位置,否则返回-1
12. Vue コンポーネントのデータが関数である必要があるのはなぜですか
因为组件data中的数据都应该是相互隔离的,应该私有化,如果写成对象形式的话引用,在多个组件使用时可能会发送错误
13. Vue2.x 双方向バインディングの原理は何ですか
object.definpropoty
14. CSS セレクターとは何ですか、またその優先順位は何ですか
类选择器
ID选择器
通配符
属性选择器
子选择器
后代选择器
标签选择器
伪类选择器
id选择器>类选择器>标签选择器>子选择器>后代选择器>伪类选择器
15. 式が配列であるかどうかを判断する方法は何ですか?
- Array.prototype.isPrototypeOf(obj)
- 配列のobjインスタンス
- Object.prototypr.toString.call(obj)
- Array.isArray()
16. v-if と v-for は一緒に使用できますか? はいの場合は優先順位を、そうでない場合はその理由を説明してください
不应该一起使用,影响性能
如果要用的话,在vue2.x中,v-for优先v-if
在vue3.x中,v-if优先v-for
17. Vue.nextTick() は何をしますか?
在下次 DOM 更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法,获取更新后的 DOM。
18. CSS で中央揃えを実現する方法は何ですか。少なくとも 3 つ書いてください。
- フレックス
- 絶対位置決め+マージン
- 絶対位置決め + 変換
19. イベントのバブリングとデフォルトの動作を防ぐ方法、標準メソッドを作成する
-
イベントのバブリングを防ぐ
event.stopPropagation() addEventListener的第三个参数为true
-
デフォルトの動作を防止する
1. event.preventDefault() 2. return fasle 3. returnValue=false (IE)
20. Vue コンポーネントのライフサイクル フックは何ですか?
beforCreate
created
beformountd
mounted
beforupdate
updated
befordestory
destoryed
21. CSS導入時のlinkと@importの違い
link会在dom渲染前加载,@import是在dom渲染完才加载
22. JavaScriptにおけるcallとapplyの機能と違い
作用:改变this指向
区别:call和apply的第一个参数是指向的对象,call在第一个参数后面可以跟n个参数,而apply在第一个参数后面只有一个数组参数
23. Promise の状態とその意味は何ですか?
pending:正在进行中
rejected:失败
fulfilled:成功
24. VueRouter が使用するルーティング モード
hash:使用url的hash值来作为路由。支持所有浏览器
history:使用HTML5 API和HTTP服务器端配置,没有后台配置的话,页面刷新时会出现404
25. プログラムによるナビゲーションを実装するために VueRouter が呼び出せるメソッドは何ですか
push():有历史记录,可以回退到上一次记录
replace():替换了记录,想当于没有历史记录,不可以回退到上一次
goBack():后退到上一次的历史记录
goForword():前进到下一次的历史记录
go():为-1时后退,可以回退或者前进很多层
26. 特定の数値の階乗演算を実現する再帰関数を作成します (5! = 5 * 4 * 3 * 2 * 1)。
function fn(n){
if(n==1){
return 1
}
return n*fn(n-1)
}
fn(5)
27. Vue2.x のフィルターの機能とその定義方法は何ですか?
用来过滤,一般可以用来格式化事件和金额,
全局过滤器定义:Vue.filter('过滤器的名字',function(val){
处理函数
})
局部过滤器定义:在filters选项中定义
28. VueRouter はルートの遅延読み込みをどのように実装しますか
ES6方法:()=>import('路径')
Vue异步加载技术:resolve=>require(['路径'],resolve)
29. エムとレムの違い
em相对于父元素字体大小
rem相对于根元素字体大小
30. 配列要素の重複排除を実装する方法。実現するための 3 つのメソッドを書いてください。
-
設定
const res=Array.from(new Set(arr))
-
2層ループ+スプライス方式を採用
function res(arr){ let len=arr.length for(let i=0;i<len;i++){ for(let j=i+1;j<len;j++){ if(arr[i]===arr[j]){ arr.splice(j,1) len-- j-- } } } return arr } res(arr)
-
配列のindexOfメソッドを使用する
function removeDuplicate(arr){ const newArr=[] arr.forEach(item=>{ if(newArr.indexOf(item)=== -1){ newArr.push(item) } }) return newArr } removeDuplicate()