TikTok Frontend Intern Interview: A Sophomore's Journey Through the Technical Screen

Frontend InternAuthor: BeautyResume Team

A sophomore CS student shares their TikTok frontend intern technical screen experience, covering CSS layouts, JS closures and prototype chains, React fundamentals, debounce/throttle implementation, and algorithm questions, ultimately landing the offer.

Background

Let me start with my situation. I'm a sophomore majoring in Computer Science at a top university. I taught myself frontend development during my freshman year, working my way from HTML/CSS to React, and built two personal projects that I published on GitHub. Honestly, when I applied for the TikTok frontend intern position, I had zero confidence — after all, I was only a sophomore, and most people applying for internships were juniors or even grad students.

But I figured, why not? The worst that could happen was a rejection. So I submitted my resume on the very first day the TikTok campus internship portal opened, applying for the Frontend Developer Intern position. To my surprise, I received an interview invitation about a week later. I was so excited I nearly jumped out of my chair.

The interview was scheduled as an online video call via Feishu (Lark) Meetings. My interviewer was a young guy who I later learned was a frontend developer on the TikTok e-commerce team. The entire interview lasted about 55 minutes — fast-paced but not oppressive. Overall, it was a pretty good experience.

Interview Process Breakdown

Self-Introduction (About 3 Minutes)

The interviewer asked me to introduce myself. I had prepared a roughly 1-minute version in advance, focusing on my tech stack and project experience. My advice here: keep your self-introduction concise and highlight the key points. The interviewer will follow up based on what you mention.

CSS Layout Section (About 10 Minutes)

The interviewer started with CSS layout questions, and I handled this part fairly well.

Question 1: What's the difference between flex and grid layouts? What scenarios is each suited for?

I explained that flex is a one-dimensional layout system, ideal for arranging items in a single row or column, while grid is a two-dimensional layout system, better for complex row-column intersections. I gave examples: a navigation bar works great with flex, while a full-page grid layout is better suited for CSS grid. The interviewer followed up on common flex properties, and I mentioned justify-content, align-items, flex-grow, and flex-shrink. I also specifically noted that flex: 1 is shorthand for flex-grow: 1, flex-shrink: 1, and flex-basis: 0%.

Question 2: How do you center an element both horizontally and vertically?

This is a classic question. I listed four approaches: flex with justify-content + align-items, grid with place-items: center, absolute positioning + transform, and absolute positioning + margin auto. The interviewer nodded and didn't追问 further.

JavaScript Fundamentals Section (About 15 Minutes)

This section went deeper and was the most challenging part for me.

Question 3: Explain your understanding of closures.

I said a closure is when a function can access variables from its outer scope, even after the outer function has finished executing. I gave the classic counter example. The interviewer followed up: what problems can closures cause? I said memory leaks, because the referenced variables won't be garbage collected. He then asked how to fix this, and I said to manually set the references to null.

Question 4: What is the prototype chain?

I started from the relationship between __proto__ and prototype, explaining that objects point to their constructor's prototype via __proto__, and this chain continues up to null. The interviewer asked me to draw the prototype chain, so I sketched out the chain: obj -> Foo.prototype -> Object.prototype -> null. He also asked about the principle behind instanceof, and I explained it checks whether the constructor's prototype exists in the object's prototype chain.

Question 5: What's the difference between var, let, and const?

This was relatively basic. I explained that var has hoisting, let and const have block scope, and const can't be reassigned after declaration. The interviewer followed up by asking whether you can modify properties of an object declared with const. I said yes, because const ensures the reference address stays the same, not the value itself.

React Fundamentals Section (About 10 Minutes)

Question 6: What is the purpose of the key prop in React?

I explained that keys help React identify which elements have changed, improving reuse in the diff algorithm. Using index as a key can cause problems — for example, when a list is reordered, it can lead to unnecessary re-renders or even bugs. The interviewer asked for a specific bug example, and I mentioned that deleting a list item might bind state to the wrong element.

Question 7: When do useState and useEffect execute?

I said useState initializes state when the component renders, and subsequent calls return the latest value. useEffect executes asynchronously after DOM updates, essentially combining componentDidMount, componentDidUpdate, and componentWillUnmount. The interviewer also asked about the difference between useLayoutEffect and useEffect. I didn't answer this one perfectly — I only mentioned that useLayoutEffect executes synchronously right after DOM updates and may block rendering.

Coding Section (About 12 Minutes)

Question 8: Implement a debounce function.

I had prepared for this, so it went smoothly. The core idea is to call clearTimeout each time before setting a new timer. The interviewer asked me to explain the code, and I described how debounce works by only executing after the delay following the last trigger, which is ideal for scenarios like search input.

Question 9: Implement a throttle function.

I implemented throttle using the timestamp approach. The core logic records the last execution time and only runs the function if the current time minus the last execution time exceeds the interval. The interviewer asked about the difference between debounce and throttle. I said debounce waits for the last trigger, while throttle executes at fixed intervals.

Algorithm Section (About 5 Minutes)

Question 10: LeetCode 1 - Two Sum.

This is a classic problem. I implemented it using a hash map with O(n) time complexity. The interviewer asked me to explain my approach: iterate through the array, check if target - nums[i] exists in the hash map, return the two indices if found, otherwise add the current element to the hash map.

Complete Question List

1. Differences between flex and grid layouts and their use cases

2. Multiple ways to center an element horizontally and vertically

3. Closure concepts, use cases, and memory issues

4. Prototype chain principles and instanceof implementation

5. Differences between var, let, and const

6. Purpose of React's key prop and problems with using index as key

7. Execution timing of useState and useEffect

8. Differences between useLayoutEffect and useEffect

9. Implement a debounce function

10. Implement a throttle function

11. Two Sum (LeetCode 1)

Key Takeaways

1. Fundamentals are crucial. While no question was extremely difficult, each topic was explored in depth. For closures, it wasn't just about the concept — you also needed to know about memory leaks. For prototype chains, you needed to draw diagrams and explain instanceof. Study fundamentals thoroughly, not just surface-level concepts.

2. Practice coding by hand. For high-frequency coding questions like debounce and throttle, just understanding them isn't enough — you need to write them from scratch. I recommend writing out at least the top 20 common coding questions before your interview to build muscle memory.

3. Don't fear algorithms. Internship interviews typically don't have very hard algorithm questions. Easy problems like Two Sum appear frequently. Completing the easy and medium problems from LeetCode's Hot 100 should be sufficient.

4. Prepare your project experience. Although the interviewer didn't dive deep into my projects this time, they clearly showed interest during my self-introduction. Prepare 2-3 standout projects where you can clearly explain your tech choices, challenges encountered, and solutions.

5. Sophomores can apply too. Don't let your class year discourage you. Many companies' requirements for interns aren't as high as you might think. With solid fundamentals and project experience, getting an internship offer as a sophomore is entirely possible.

FAQ

Q: How many interview rounds does TikTok typically have for internships?

A: Frontend internships usually have 1-2 technical rounds. I only had one round and received an offer, possibly because the internship position requirements are relatively lower.

Q: What platform was the interview on?

A: Feishu (Lark) Meetings for the video call. Code was written in a Feishu online document, not a LeetCode-style editor.

Q: Can you pass without prior internship experience?

A: Yes. I had no internship experience before this — I relied mainly on my projects and personal tech blog. Interviewers care more about fundamentals and potential.

Q: How long until results come out?

A: I received an HR call about 3 days after the interview. The process was quite efficient.

Q: What's the difference between sophomore and junior year internships?

A: Basically none — the interview process and evaluation criteria are the same. The advantage of being a sophomore is having more time; the disadvantage is that you may not have completed all your coursework yet and need to self-study the fundamentals.

#TikTok#Frontend Intern#Campus Recruitment#CSS#JavaScript#React# Algorithms